CSS中,我們可以使用background-size屬性來填充圖片以使其適應整個頁面。同時,我們也可以使用background-position屬性來決定背景圖片的位置。
body { background-image: url(圖片鏈接); background-size: cover; background-position: center; }
background-size: cover會將圖片縮放以使其填滿整個頁面,而background-position: center會讓圖片居中顯示。如果你希望圖片可以重復顯示,可以使用background-repeat屬性。
body { background-image: url(圖片鏈接); background-size: cover; background-position: center; background-repeat: repeat; }
如果您希望背景圖片的大小與頁面保持一致,可以使用background-size: 100% 100%。同時您可以使用background-attachment: fixed屬性使圖片跟隨滾動條移動。
body { background-image: url(圖片鏈接); background-size: 100% 100%; background-position: center; background-attachment: fixed; }
在使用圖片作為頁面背景時,建議注意圖片的大小與質量。太小的圖片可能會失真,而太大的圖片可能會影響頁面加載速度。
上一篇css進度條0到100
下一篇圖片排序css