CSS 背景圖可以通過某些屬性進行更改。其中,使用 opacity 屬性可以將背景圖變成透明。
background-image: url('image.jpg'); opacity: 0.5;
上述代碼將會顯示一個名為 image.jpg 的圖片,同時將其不透明度設置為 0.5。這意味著背景圖片的透明度將會降低,顯示出背景色或其他元素。
除此之外,我們也可以使用 RGBA 顏色值來設定背景顏色的透明度。RGBA 中的 A 屬性表示顏色的透明度,取值范圍在 0 到 1 之間。
background-color: rgba(255,255,255,0.5);
上述代碼將會設置一個白色的背景,并將其透明度設置為 0.5。這樣,背景色將會半透明顯示,而不會完全遮蓋底部內容。
需要注意的是,透明度屬性不僅適用于背景圖片和背景顏色,也可以應用于元素本身。我們可以通過設置元素不透明度來控制其在頁面上的透明程度。
opacity: 0.5;
上述代碼會將元素的不透明度設置為 0.5。這樣,元素將會半透明顯示,并透出背后的內容。
上一篇css背景圖切換卡的