CSS背景圖片控制大小的方法

在CSS中，我們可以使用background-size屬性來控制背景圖片的大小，這個屬性接受兩個值，分別是寬度和高度，如果我們只提供一個值，那么另一個值會自動計算以保持原始圖片的寬高比。

如果我們想要將背景圖片放大到原來的兩倍，我們可以使用以下CSS代碼：

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

這段代碼會將背景圖片放大到原來的兩倍大小，如果我們想要將圖片放大到原來的三倍大小，我們可以將background-size的值修改為300% 300%。

我們還可以使用contain和cover關(guān)鍵字來控制背景圖片的大小。contain關(guān)鍵字會保持圖片的原始寬高比，并將圖片縮小到能夠完全適應(yīng)元素的大小，而cover關(guān)鍵字則會將圖片放大到能夠完全覆蓋元素的大小，可能會超出元素的寬度或高度。

如果我們想要將背景圖片設(shè)置為contain模式，我們可以使用以下CSS代碼：

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

這段代碼會將背景圖片設(shè)置為contain模式，并保持圖片的原始寬高比，如果我們想要將圖片設(shè)置為cover模式，我們可以將background-size的值修改為cover。

CSS提供了多種方法來控制背景圖片的大小，我們可以根據(jù)自己的需求選擇***適合的方法。