CSS是前端必備的技能之一，對于網頁的布局和樣式都非常重要。其中一個特別實用的功能就是通過寬度計算高度，今天我們就來學習這一技能。

.box{
width: 200px;
height: auto;
padding: 10px;
border: 1px solid #000;
}

通過設置寬度為固定值，高度設置為auto，這樣就可以根據內容的寬度自動計算出高度值。例如，我們在一個div容器中寫入一段文字，就可以看到這個div容器的高度會自動適應文字內容。

這是一段文字內容。

當然，如果我們需要設置一個最小高度，也可以使用min-height屬性。這樣即使內容很少，也可以確保div容器的最小高度。

.box{
width: 200px;
min-height: 100px;
padding: 10px;
border: 1px solid #000;
}

除此之外，還可以使用flex布局和grid布局來實現自適應高度。這兩種布局是現代前端常用的布局方式，可以更加靈活地控制樣式。

總結一下，通過寬度計算高度是CSS中比較實用的技能，可以幫助我們更好地控制網頁的布局和樣式。如果您還不會使用，現在就可以動手練習一下哦。