设置HTML元素的透明度，兼容IE

您现在的位置：摘星网络_临沂网站建设优化 > 网站制作 > 站长经验 >

W3C标准属性是opacity,现代浏览器都支持，但IE6/7/8却不支持该属性。

在Firefox，Safari，Opera，Chrome中测试都支持opacity。如设置div的透明度为40%。

01 <!DOCTYPE HTML>

02 <html>

03 <head>

04 <title>set div opacity</title>

05 <style>

06 .wrapper {

07 border:solid 1px gray;

08 opacity:0.4;

09 }

10 </style>

11 </head>

12 <body>

13 <div class="wrapper">

14 set div opacity

15 </div>

16 </body>

17 </html>

注意：firefox3.5以下版本使用-moz-opacity属性。

IE6/7/8中复杂些

1、IE4-IE7使用filter: alpha(opacity=xx)，但要同时使该元素拥有hasLayout

01 <!DOCTYPE HTML">

02 <html>

03 <head>

04 <title>set div opacity</title>

05 <style>

06 .wrapper {

07 border:solid 1px gray;

08 background-color:green;

09 filter: alpha(opacity=40);

10 zoom:1;

11 }

12 </style>

13 </head>

15 <body>

16 <div class="wrapper">

17 set div opacity

18 </div>

19 </body>

20 </html>

2、IE8下也可以用上面的filter: alpha(opacity=10)，且不用设置zoom使元素拥有layout。同时IE8可以使用-ms-filter属性。如

-ms-filter: "alpha(opacity=10)"; /* IE 8 */

用这个更直接，一下就ok了

张啸建站工作室为您提供临沂网站建设，自助建站－会打字就会建站，域名注册，虚拟主机，网站优化咨询服务，价格低，质量优，与您的网站一起成长。欢迎进行入 zxroom.net

上一篇：对IE系列产品进行html条件注释

下一篇：什么是html选择器？