CSS屏幕自適應寬度是指網頁能在不同尺寸的屏幕上自動調整布局，以適應不同的設備。這種技術在移動設備的普及下變得越來越重要。

下面的代碼演示了如何使用CSS來實現自適應寬度：

body {
margin: 0;
padding: 0;
}
.container {
max-width: 1200px;
margin: 0 auto;
background-color: #ffffff;
}

其中，max-width屬性定義了元素最大寬度，margin: 0 auto;用于在屏幕中水平居中元素。

此外，可以使用CSS媒體查詢來根據設備屏幕尺寸應用不同的樣式。下面的代碼演示了如何根據屏幕寬度變化而改變元素的背景顏色：

@media only screen and (max-width: 600px) {
.container {
background-color: #f2f2f2;
}
}
@media only screen and (min-width: 601px) and (max-width: 900px) {
.container {
background-color: #d9d9d9;
}
}
@media only screen and (min-width: 901px) {
.container {
background-color: #ffffff;
}
}

這里使用了三個媒體查詢來針對不同寬度的屏幕應用不同的樣式。需要注意的是，媒體查詢必須放在CSS樣式表的末尾，否則可能被其他樣式所覆蓋。

總而言之，CSS屏幕自適應寬度是一種重要的技術，可讓網頁在不同尺寸的設備上呈現出最佳效果。正確地使用這種技術可以大大提高用戶體驗。