css设置不透明度

发布于 2016-10-11 作者 [重庆SEO]

通常我要用某个功能和方法的时候,大多是临时GOOGLE一下,记住一个大概的概念,以便之后再次搜索使用。最近CSS设置不透明度用得比较频繁,所以整理一下笔记,稍微加深一下印象!

CSS设置不透明度的方法有:

css3的opacity:x,x 的取值从 0 到 1,如opacity: 0.8
css3的rgba(red, green, blue, alpha),alpha的取值从 0 到 1,如rgba(255,255,255,0.8)
IE专属滤镜 filter:Alpha(opacity=x),x 的取值从 0 到 100,如filter:Alpha(opacity=80)

他们的区别和应用场景

opacity
用于元素整体设置不透明度,背景和文字都具有了不透明度
rgba
可用来设置元素背景不透明度,不干扰文字的不透明度
filter:Alpha
通常用来兼容低版本比如IE8以及IE8以下浏览器,另外,由于低版本浏览器用户数量越来越少,为了更好的用户体验和维护,对于相关的其他小兼容性问题,很多人已不再处理!