CSS中調(diào)節(jié)背景圖大小的方法

在CSS中，我們可以使用background-size屬性來調(diào)節(jié)背景圖的大小，這個屬性可以指定背景圖片的寬度和高度，或者只指定一個值，另一個值會自動縮放以保持原始圖片的寬高比。

如果我們有一個背景圖片，想要將其寬度調(diào)節(jié)為300像素，并保持原始圖片的寬高比，可以使用以下CSS代碼：

div {
  background-image: url('path/to/image.jpg');
  background-size: 300px auto;
}

在這個例子中，background-size屬性將背景圖片的寬度設(shè)置為300像素，高度設(shè)置為auto，這樣背景圖片就會按照原始圖片的寬高比進行縮放。

如果想要將背景圖片填充到整個元素中，可以使用cover關(guān)鍵字：

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

這樣，背景圖片就會盡可能地填充到整個元素中，可能會超出元素的邊界，如果想要保證背景圖片始終保持在元素的邊界內(nèi)，可以使用contain關(guān)鍵字：

div {
  background-image: url('path/to/image.jpg');
  background-size: contain;
}

這樣，背景圖片就會始終保持在元素的邊界內(nèi)，無論圖片的尺寸如何。