CSS 中的寬度是一個重要的概念，而自適應性讓它更為關鍵。自適應的寬度意味著元素的寬度會根據屏幕尺寸和瀏覽器大小而自動調整，以提供最佳的用戶體驗。下面是一些關于 CSS 寬度自適應的技巧。

CSS 中定義元素寬度時，通常會使用百分比或像素值。百分比寬度可以讓元素的寬度隨著瀏覽器大小而自動調整，因此是實現自適應寬度的常用方式。像素值則表示元素在屏幕上的實際寬度，不會根據瀏覽器大小而自適應。

.box {
width: 100%; /* 設置寬度為父元素寬度的百分之百 */
}
.box img {
width: 100%; /* 圖像寬度為父元素寬度的百分之百 */
}

使用百分比寬度時，需要明確元素所處的上下文，以確保寬度的正確計算。例如，如果一個盒子的寬度為 80%，那么它實際上是相對于其父元素的寬度而言的。如果父元素的寬度發生變化，那么該盒子的寬度也會相應調整。

另一個常用的方式是使用 max-width 和 min-width 來控制元素寬度的上下限，而不是固定的像素或百分比。這種方法可以確保元素的寬度在一定范圍內自適應，同時避免在不同設備上出現過大或過小的元素。

.box {
max-width: 100%; /* 最大寬度為父元素寬度的百分之百 */
min-width: 320px; /* 最小寬度為 320 像素 */
}
.box img {
max-width: 100%; /* 最大寬度為父元素寬度的百分之百 */
min-width: 100px; /* 最小寬度為 100 像素 */
}

CSS 中的自適應寬度是實現響應式設計的重要技巧之一。通過理解這些技巧，可以更好地控制網站或應用程序的布局和呈現，以提供更好的用戶體驗。