CSS背景圖片如何自適應呢？這是網頁設計過程中經常遇到的一個問題。下面我們來介紹一些方法。 首先，讓背景鋪滿整個容器，可以使用以下代碼：

.container {
background-image: url('image.jpg');
background-size: cover;
}

其中，background-size屬性的值為cover時，會拉伸圖片，讓它填滿整個容器。這種方法的缺點是，容器的寬高比與圖片的寬高比不一致時，圖片會被拉伸變形。如果你不想讓圖片變形，可以使用以下代碼：

.container {
background-image: url('image.jpg');
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}

這種方法中，background-size屬性的值為contain時，會讓圖片自適應容器大小，而不會被拉伸變形。background-repeat屬性的值為no-repeat時，可以讓圖片不重復出現。而background-position屬性的值為center時，則可以讓圖片在容器居中顯示。 如果你希望背景圖片在容器中居中顯示，且不被拉伸變形，可以使用以下代碼：

.container {
background-image: url('image.jpg');
background-size: auto;
background-repeat: no-repeat;
background-position: center;
}

這種方法中，background-size屬性的值為auto時，會讓圖片按原大小顯示。而其他兩個屬性則與前面的方法相同。 以上就是幾種常見的讓CSS背景圖片自適應容器的方法。使用這些方法，我們可以更好地控制背景圖片的顯示效果，讓網頁設計更加精美。