返回顶部

收藏

跨浏览器的半透明实现css代码

更多

IE,firefox,和chrom等浏览器对半透明都有不同的要求,如下代码是跨浏览器的半透明实现代码:

<!doctype html>
<html>
<head>
<style>

#example-transparency {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* ie8 supports both; this variant doesn't work if meta tag below used */
  filter:alpha(opacity=75); /* for internet explorer <= 7, and 8 when <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> */
  -moz-opacity:0.75; /* for older gecko browsers */
  -khtml-opacity: 0.75; /* for older webkit browsers */
  opacity: 0.75; /* CSS3 standard */
  background-color: #000;
  position: absolute;
  margin-top: 40px;
  height: 50px;
  width: 600px;
}
#example-transparency p {
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin-top: 15px;
}
</style>
</head>
<body>
<div id="example-transparency">
<p>这是半透明的文本块</p>
</div>
<p>OutOfmemory.CN 为程序员服务,有意思!</p>

</body>
</html>

标签:css

收藏

1人收藏

支持

1

反对

0