在設(shè)置背景透明度時，新手用到opacity是不是會碰到連內(nèi)容也跟著透明的情況呢？這里介紹兩種方法。
在對元素進(jìn)行透明度的設(shè)置時，經(jīng)常用到的有opacity與background-color:rgba()。
那么，它們到底有啥區(qū)別呢？
在使用opacity時，處了對背景生效之外，應(yīng)用它的元素的內(nèi)容也會繼承它。就是說它的子元素也會繼承它。
下面，對提示框進(jìn)行一個透明度的設(shè)置。
首先使用了opacity屬性
仔細(xì)看，紅色的字也跟著變淺了，它繼承了上一級的元素屬性。
在使用了background-color:rgba(0,0,0,0.5)之后
這里僅僅是背景透明了，框內(nèi)的文字并沒有繼承該屬性。
所以說，rgba()和opacity都能實現(xiàn)透明效果，但最大的不同是opacity作用于元素，以及元素內(nèi)的所有內(nèi)容的透明度，而rgba()只作用于元素的顏色或其背景色。（設(shè)置rgba透明的元素的子元素不會繼承透明效果?。?/span>
上一篇： html5中的date-*屬性
下一篇： 如何用css3做出漸變的效果
關(guān)鍵詞:
