CSS背景大小設置

在CSS中，我們可以使用background-size屬性來設置背景圖片的大小，這個屬性接受兩個值，分別是水平和垂直方向上的尺寸。

如果我們想要將背景圖片設置為寬度為200像素，高度為100像素，我們可以這樣寫：

div {
  background-image: url('image.jpg');
  background-size: 200px 100px;
}

在這個例子中，200px表示水平方向上的尺寸，100px表示垂直方向上的尺寸，這樣設置后，背景圖片就會按照指定的尺寸進行顯示。

除了具體的數(shù)值外，我們還可以使用百分比來設置背景圖片的大小，如果我們想要將背景圖片的寬度設置為容器寬度的50%，高度設置為容器高度的30%，我們可以這樣寫：

div {
  background-image: url('image.jpg');
  background-size: 50% 30%;
}

在這個例子中，50%表示水平方向上的尺寸，30%表示垂直方向上的尺寸，這樣設置后，背景圖片就會按照指定的百分比進行顯示。

需要注意的是，如果背景圖片的長寬比與容器不同，那么圖片可能會被拉伸或壓縮，為了避免這種情況，我們可以使用background-size: cover;來確保背景圖片始終覆蓋整個容器，但可能會留下空白區(qū)域。

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

在這個例子中，背景圖片會被縮放并填充整個容器，但可能會留下空白區(qū)域。