CSS是一種用于定義和布局網頁內容的樣式表語言，可以控制網頁中所有HTML元素的外觀和樣式。其中一項常用的技能就是寬度計算高度。

CSS的寬度計算高度是自適應的，可以根據不同設備的屏幕大小來計算元素的高度。通過CSS的box-sizing屬性，元素的高度會隨著寬度的變化而自適應調整，從而實現頁面的響應式布局。

具體來說，box-sizing屬性有兩個值可以選擇：content-box和border-box。默認值是content-box，意味著元素的寬度和高度只包括內容區域，而不包括內邊距和邊框。當我們設置元素的寬度為100%時，它會根據父元素的寬度自動調整大小，但是元素的高度不會有所變化。

div {
box-sizing: content-box;
width: 100%;
padding: 10px;
border: 1px solid black;
background-color: grey;
}

如果我們將box-sizing屬性設置為border-box，那么元素的寬度和高度都將包括內邊距和邊框。當我們設置元素的寬度為100%時，它會根據父元素的寬度自動調整大小，同時也會自適應調整高度。

div {
box-sizing: border-box;
width: 100%;
padding: 10px;
border: 1px solid black;
background-color: grey;
}

通過使用CSS的寬度計算高度技巧，可以使我們的網頁布局更加靈活和適應不同設備的屏幕大小，提升用戶體驗。