久久无码中文字幕_日韩精品无码一本二本三_久久精品呦女暗网_欧美一级夜夜爽_久久精品国产99久久99久久久

04
2017/03

CSS:透明度 opacity與rgba()的區(qū)別

發(fā)布時間:2017-03-04 08:34:48
發(fā)布者:jiangbing
瀏覽量:
0


在設置背景透明度時,新手用到opacity是不是會碰到連內(nèi)容也跟著透明的情況呢?這里介紹兩種方法。

在對元素進行透明度的設置時,經(jīng)常用到的有opacity與background-color:rgba()。

那么,它們到底有啥區(qū)別呢? 

在使用opacity時,處了對背景生效之外,應用它的元素的內(nèi)容也會繼承它。就是說它的子元素也會繼承它。

下面,對提示框進行一個透明度的設置。

首先使用了opacity屬性

}KH8CL24)YEV2@FGO82)V5V.png

仔細看,紅色的字也跟著變淺了,它繼承了上一級的元素屬性。

在使用了background-color:rgba(0,0,0,0.5)之后

](B{{{[(5}GCO`7MP6R7LJT.png

這里僅僅是背景透明了,框內(nèi)的文字并沒有繼承該屬性。



所以說,rgba()和opacity都能實現(xiàn)透明效果,但最大的不同是opacity作用于元素,以及元素內(nèi)的所有內(nèi)容的透明度,而rgba()只作用于元素的顏色或其背景色。(設置rgba透明的元素的子元素不會繼承透明效果?。?/span>


關鍵詞:
返回列表