我想創建一個div可以隨著窗口寬度的變化而改變寬度/高度的東西。是否有任何CSS3規則允許高度根據寬度改變，同時保持其寬高比？我知道我可以通過JavaScript實現這一點，但我更喜歡只使用CSS。
5 回答
函數式編程
TA貢獻1807條經驗 獲得超9個贊
基于你的解決方案，我已經做了一些技巧：
當您使用它時，您的HTML將是唯一的
<div data-keep-ratio="75%">
<div>Main content</div>
</div>
以這種方式使用它：CSS：
*[data-keep-ratio] {
display: block;
width: 100%;
position: relative;
}
*[data-keep-ratio] > * {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
}
和js（jQuery）
$('*[data-keep-ratio]').each(function(){
var ratio = $(this).data('keep-ratio');
$(this).css('padding-bottom', ratio);
});
有了這個，你只需將attr設置data-keep-ratio為高度/寬度即可。
- 5 回答
- 0 關注
- 3974 瀏覽
相關問題推薦
添加回答
舉報
0/150
提交
取消