在Web開發中,有時需要設置背景透明屬性來實現一些特殊的效果。CSS提供了一種設置背景透明度的屬性——opacity
。
background-color: #000; opacity: 0.5;
上面的代碼表示將背景色設置為黑色,透明度為50%。此時該元素的內容將顯示在黑色透明背景上,同時看得到頁面下方的其他元素。
需要注意的是,opacity
屬性會同時改變元素及其所有子元素的透明度,如果只想改變背景的透明度而保持元素內部內容不變,可以使用rgba
或hsla
函數來設置背景顏色的透明度。
background-color: rgba(0,0,0,0.5);
上面的代碼同樣表示將背景色設置為黑色,透明度為50%。但是與上面的css不同的是,rgba
函數只對背景色進行透明度的改變,元素的其他內容不受影響。
除此之外,還可以使用transparent
關鍵字來設置背景顏色完全透明。
background-color: transparent;
上面的代碼表示將元素的背景顏色完全透明,即不顯示任何顏色。
上一篇css 超過寬度省略
下一篇css 調用字體無效