HTML教程：HTML元素设置透明度

来源：学生作业帮助网编辑：作业帮时间：2024/05/10 18:25:07 HTML

HTML教程：HTML元素设置透明度HTML

【51Test.NET-HTML教程：HTML元素设置透明度】：

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

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

01 HTML>
02<html>
03  <head>
04    <title>set div opacitytitle> 
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>
17html>

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

IE6/7/8中复杂些

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

01
02<html>
03  <head>
04    <title>set div opacitytitle>
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>
14  
15  <body>
16    <div class="wrapper">
17        set div opacity
18    div>                
19  body>
20html>

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

HTML