HTML语言教程:设置HTML元素的透明度

来源：学生作业帮助网编辑：作业帮时间：2024/11/27 06:55:05 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 {
07border:solid 1px gray;
08opacity:0.4;
09}
10style>
11head>
12<body>
13<div class="wrapper">
14set div opacity
15div> 
16body>
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 {
07border:solid 1px gray;
08background-color:green;
09filter: alpha(opacity=40);
10zoom:1;
11}
12style>
13head>
14
15<body>
16<div class="wrapper">
17set div opacity
18div> 
19body>
20html>

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

HTML