在CSS中,可以使用background-image
屬性來設(shè)置兩個背景圖片,這個屬性接受多個圖片路徑,每個路徑用逗號隔開,這樣,瀏覽器會嘗試從每個路徑下載圖片,并將它們作為背景圖片疊加在一起。
假設(shè)你有兩個圖片文件image1.png
和image2.png
,你可以這樣設(shè)置:
body { background-image: url('image1.png'), url('image2.png'); background-position: top, bottom; background-repeat: no-repeat, no-repeat; }
在這個例子中,image1.png
和image2.png
會分別被設(shè)置為背景圖片,位置分別在頂部和底部,且不會重復(fù)。
需要注意的是,如果兩個圖片的大小不同,可能會導(dǎo)致背景圖片顯示不完全或者出現(xiàn)空白區(qū)域,在設(shè)置背景圖片時,***好確保圖片的大小相同或者相似。
background-image
屬性還支持其他多個值,例如repeat
、size
等,可以用來控制背景圖片的顯示方式,具體的使用方式可以參考CSS文檔或者在線教程。