在CSS中添加背景圖片是很常見的操作,但你知道怎樣添加兩張背景圖片嗎?接下來我們將會介紹如何在CSS中使用兩張背景圖片。
background-image: url('背景圖片1的地址'), url('背景圖片2的地址'); background-position: center 90%, center; background-repeat: no-repeat; background-size: auto 40%, auto;
在上面的代碼中,我們使用了background-image
屬性同時引入了兩張背景圖片。其中,background-position
屬性定義了兩張背景圖片的位置,第一張圖片居中靠底部center 90%
,第二張圖片居中center
。接著,我們使用了background-size
屬性來設(shè)置背景圖片的大小,第一張圖片高度的40%auto 40%
,第二張圖片大小為自適應(yīng)auto
。
最后,我們使用了background-repeat
屬性來取消背景圖片的重復(fù)。
總之,在CSS中可以使用多張背景圖片,通過上面的代碼你可以輕松實現(xiàn)在一個元素中添加兩張背景圖片的效果。