css3的opacity属性用法详解|三体教程
文章目录

css3的opacity属性用法详解

对于css3的opacity属性现在所有浏览器都支持,不过ie8之前的版本则是使用替代的filter属性。

语法

opacity: value|inherit;

其中value是设置不透明度,从0.0(完全透明)到1.0(完全不透明)。

inherit表示应该从父元素继承opacity属性的值。

为了使其兼容,我们最好写成这样的,如下:

opacity: .8;filter: alpha(opacity=80);

加上:filter: alpha滤镜效果,兼容IE6、7、8。

注意,上面的“.8”和“0.8”是一样的,这里只是简写。

以下实例将div元素设置一半透明度。

<img src="http://www.santii.com/source/img_lights.jpg" class="img" />

<style>

.img{opacity:0.5;filter: alpha(opacity=50);}

</style>

最后需要说一下的,为了兼容一些老版本的Mozilla浏览器,取值范围在0-1之间,我们使用-moz-opacity。

为了兼容一些老版本的Safari浏览器,取值范围在0-1之间,我们使用-khtml-opacity。

本文网址:http://www.santii.com/article/96.html


数据更新时间:2018-07-22