CSS是網頁設計中最常用的語言之一，而寬度設為自適應是CSS的常見應用之一。接下來我們就來詳細了解一下寬度設為自適應的知識點。

首先，為了實現寬度自適應，我們需要了解CSS中的box-sizing屬性。box-sizing屬性決定了網頁的盒模型怎么算，有兩個值：content-box和border-box。

box-sizing: content-box;

當此屬性值為content-box時，則盒模型的寬度只包含內容區域，不包含邊框和內邊距，此時我們需要加上額外的border和padding才能達到我們想要的寬度。例如：

div {
padding: 20px;
border: 10px solid #000;
width: 300px;
}

這樣設置寬度時，實際上div的寬度為340px（300px + 2*20px + 2*10px）。

box-sizing: border-box;

當此屬性值為border-box時，則盒模型的寬度包含內容區域、內邊距和邊框，這樣我們就可以直接設置寬度了。例如：

div {
padding: 20px;
border: 10px solid #000;
width: 300px;
box-sizing: border-box;
}

這樣設置寬度時，實際上div的寬度就是300px。

除了使用box-sizing屬性，我們還可以使用百分比來設置寬度自適應。例如：

div {
width: 100%;
}

這樣設置寬度時，實際上div的寬度會自動適應其父元素的大小，無需設置具體的數值。

總之，使用CSS寬度設為自適應，可以讓網頁適應不同的屏幕大小和設備，提高用戶體驗。