浏览 6554 次
|
锁定老帖子 主题：设置html元素的透明度
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2009-09-16
最后修改：2010-07-15
w3c标准属性是opacity,firefox3.5支持，但IE却不支持该属性（即使是最新的IE8）。
在FF3.5++，safari4，opera10，chrome4中测试都支持opacity。如设置div的透明度为40%： <!DOCTYPE HTML">
<html>
<head>
<title>set div opacity</title>
<style>
.wrapper {
border:solid 1px gray;
opacity:0.4;
}
</style>
</head>
<body>
<div class="wrapper">
set div opacity
</div>
</body>
</html>
注意：firefox3.5以下版本使用
IE下复杂些： 1、IE4-IE7使用filter: alpha(opacity=xx)，但要同时使该元素拥有hasLayout <!DOCTYPE HTML">
<html>
<head>
<title>set div opacity</title>
<style>
.wrapper {
border:solid 1px gray;
background-color:green;
filter: alpha(opacity=10);
zoom:1;/* set "zoom", "width" or "height" to trigger "hasLayout" in IE 7 and lower */
}
</style>
</head>
<body>
<div class="wrapper">
set div opacity
</div>
</body>
</html>
2、IE8下也可以用上面的filter: alpha(opacity=10)，且不用设置zoom使元素拥有layout。同时IE8可以使用-ms-filter属性。如 -ms-filter: "alpha(opacity=10)"; /* IE 8 */
详见：https://developer.mozilla.org/En/CSS:-moz-opacity
PS : IE9 pre3已经支持opacity属性(2010-7-14) 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
