在網頁設計中,我們常常需要使用背景圖片來美化頁面。而有時我們還需要背景圖片半透明,這時候CSS圖片背景半透明就派上用場了。
background-color:rgba(255,255,255,0.5);
background-image:url(bg.png);
上面的代碼中,我們使用rgba()來定義背景顏色,其中a代表alpha值,取值范圍是0-1,0表示完全透明,1表示完全不透明。這樣可以讓背景圖片透過背景顏色顯示出來,達到半透明效果。
除了使用rgba()來定義背景顏色,我們還可以使用opacity屬性來實現背景圖片半透明:
background-image:url(bg.png);
opacity:0.5;
以上代碼中,我們使用opacity屬性來定義透明程度,取值范圍也是0-1。需要注意的是,這種方式會讓背景圖片和背景顏色一起變得半透明,而不是只有背景顏色變半透明。