一、在CSS中設置背景圖片
在CSS中設置背景圖片需要用到background-image屬性。假設我們有一張名為background.jpg的圖片需要設置為背景圖片，代碼如下：
body {
background-image: url("background.jpg");
}
這會把背景圖片設置為body元素的背景。
二、設置背景圖片大小
如果背景圖片不是一個固定的大小，並且需要設置為中心對齊，可以使用background-size屬性。代碼如下：
body {
background-image: url("background.jpg");
background-size: cover;
background-position: center;
}
上述代碼將背景圖片拉伸到鋪滿整個body元素，並且在中心對齊。
三、在CSS中設置多張背景圖片
在一些場景下，你可能需要同時展示多張背景圖片。可以使用background-image屬性來實現。代碼如下：
body {
background-image: url("background1.jpg"), url("background2.jpg");
background-position: center top, center bottom;
background-repeat: no-repeat;
}
上述代碼將展示兩張不同的背景圖片，一張在頂部中心對齊，另一張在底部中心對齊。
四、如何在HTML中添加背景圖片
HTML中可以使用style屬性來設置元素的樣式，其中就包括背景圖片。代碼如下：
原創文章，作者：HCRZ，如若轉載，請註明出處：https://www.506064.com/zh-hk/n/141072.html
微信掃一掃 
支付寶掃一掃 