在web開發(fā)中，經常需要在頁面中添加背景圖以達到美化頁面的效果。但是，有時候背景圖的尺寸和容器大小并不匹配，這個時候就需要使用CSS來適應背景圖的大小。

CSS中提供了background-size屬性，可以用于控制背景圖的尺寸。常用的屬性值有：

background-size: cover; /* 背景圖按比例縮放，完全覆蓋容器 */
background-size: contain; /* 背景圖按比例縮放，容器完全包含背景圖 */
background-size: 100% auto; /* 背景圖寬度為容器寬度，高度按比例縮放 */
background-size: auto 100%; /* 背景圖高度為容器高度，寬度按比例縮放 */

除了background-size屬性，還可以使用CSS3中的background-clip屬性來控制是否顯示超出容器范圍的背景圖部分。常用的屬性值有：

background-clip: border-box; /* 背景圖顯示在容器的邊框盒子內 */
background-clip: padding-box; /* 背景圖顯示在容器的內邊距盒子內 */
background-clip: content-box; /* 背景圖顯示在容器的內容盒子內 */

如果需要將背景圖設置為一個重復圖案，可以使用background-repeat屬性。常用的屬性值有：

background-repeat: no-repeat; /* 背景圖不重復 */
background-repeat: repeat-x; /* 背景圖水平方向重復 */
background-repeat: repeat-y; /* 背景圖垂直方向重復 */
background-repeat: repeat; /* 背景圖水平垂直方向均重復 */

總之，在布局背景圖時，CSS提供了多種方法來適應圖片大小，控制其重復方式和顯示范圍，開發(fā)者可以根據實際需求來選擇合適的方法，達到最佳的視覺效果。