CSS是前端開發中非常重要的語言，通過它我們可以很方便地對HTML文檔進行美化和布局。其中它的寬高設置是我們必須熟練掌握的技巧之一。

通常情況下，我們希望元素的寬高比是固定的，這時候如何設置呢？

.box {
width: 200px;
height: 0;
padding-bottom: 50%;
}

首先我們需要將元素的高度設為0，這是為了讓元素的高度由padding-bottom撐起。接著我們通過padding-bottom設定元素的高度百分比，如上述代碼中的50%代表著寬高比為2:1。

相信你也已經注意到了padding-bottom的計算方式。實際上，我們只需要將padding-bottom的值設置為 寬度/高度 x 100% 就可以了。比如說，如果我們希望元素寬高比為4:3，則padding-bottom的值應該為 3/4 x 100% = 75%。

除了padding-bottom方式，我們還可以使用其他方式來實現寬高成比例的效果。比如說，可以使用偽元素，將margin設為負值等等。但無論怎樣，了解和熟練掌握padding-bottom方式是非常重要的。