语法:

<length> | inherit

取值:

<length>
由浮点数字和单位标识符组成的长度值。不可为负值。默认值为:1
inherit:
默认继承。

说明:

由浮点数字和单位标识符组成的长度值。不可为负值。声明用来设置一个元素的透明度,opacity取值为1的元素是完全不透明的,反之,取值为0是完全透明的,看不见的。1到0之间的任何值都表示该元素的透明程度。

兼容性:

类型 IEInternet Explorer FirefoxFirefox ChromeChrome OperaOpera SafariSafari
版本 (×)IE6 (√)Firefox 3.0.10 (√)Chrome 2.0.x (√)Opera 9.64 (√)Safari 4
(×)IE7 (√)Firefox 3.5
(×)IE8

示例:

    
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="utf-8" />
<meta name="robots" content="all" />
<meta name="author" content="Tencent-ISRD" />
<meta name="Copyright" content="Tencent" />
<style>
img.opacity1 { opacity:0.25;}
img.opacity2 { opacity:0.50;}
img.opacity3 { opacity:0.75;}
</style>
<title>opacity</title>
</head>
<body>
<div><img src="https://imgcache.qq.com/ac/www_tencent/zh-cn/images/sitelogo_zh-cn.gif" class="opacity1" alt="tencent" /></div>
<div><img src="https://imgcache.qq.com/ac/www_tencent/zh-cn/images/sitelogo_zh-cn.gif" class="opacity2" alt="tencent" /></div>
<div><img src="https://imgcache.qq.com/ac/www_tencent/zh-cn/images/sitelogo_zh-cn.gif" class="opacity3" alt="tencent" /></div>
</body>
</html> 

快速跳转