CSS圖片的自適應，在網頁設計中是非常重要的一部分。網頁中的圖片需要適應不同設備的屏幕尺寸，以便提供更好的用戶體驗。下面我們來講解一個比較常用的CSS方法，用來實現圖片自適應。 使用background-size屬性來自適應圖片大小，相當于設置img標簽的寬和高。background-size 屬性有兩個值：contain 和 cover。contain 表示圖片盡可能小，但是不會超出父容器的范圍；cover 則表示圖片盡可能充滿整個容器，不會有任何空白部分。

/* 將背景圖片適應到div容器 */
.myDiv {
background-image: url("圖片地址");
background-size: cover;
}
/* 將背景圖片適應到body標簽 */
body {
background-image: url("圖片地址");
background-size: contain;
}

除了以上兩種方法，還有一個新的CSS屬性叫做object-fit。object-fit 同樣可以實現圖片的自適應，有著相同的兩個值 contain 和 cover。

/* 將img標簽適應到div容器 */
.myDiv img {
width: 100%;
height: 100%;
object-fit: cover;
}

使用這些CSS方法，我們可以很方便地實現網頁圖片的自適應。這對于不同尺寸的屏幕或設備，讓圖片能夠以最佳的方式呈現給用戶，從而提高用戶體驗。