CSS3不透明度发实例介绍

这篇文章主要讲解了“CSS3不透明度发实例介绍”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“CSS3不透明度发实例介绍”吧！

成都创新互联公司10多年企业网站建设服务;为您提供网站建设,网站制作,网页设计及高端网站定制服务,企业网站建设及推广,对成都阳光房等多个领域拥有多年设计经验的网站建设公司。

如何设置透明度？定义opacity属性，通过设置该属性能够使任何元素呈现出半透明效果，opacity属性的基本语法如下：

|inherit

取值说明：

1、|是由浮点数和单位标识符组成的长度值。不可为负值，默认值为1.opacity取值为1时，则元素为完全不透明的；反之，取值为0时，元素是完全透明的，不可见。

2、inherit表示继承，即继承父元素的不透明性。

3、针对IE浏览器，可以使用它的私有属性filter来兼容：filter：alpha（alpha=value）；。

实例：设计灯箱广告背景布

XML/HTML Code复制内容到剪贴板

1.   

2.   

3.   

4.   

5.   

6.   

7. body {   

8.     margin:0;   

9.     padding:0;   

10. }   

11. div { position:absolute; }   

12. .bg {   

13.     width:100%;   

14.     height:100%;   

15.     background:#000;   

16.     opacity:0.7;   

17.     filter:alpha(opacity=70);   

18. }   

19. .lightbox {   

20.     left:50px;   

21.     top:50px;   

22. }   

23.   

24.   

25.   

26.