CSS 图像透明度opacity兼容性介绍
CSS 图像透明度opacity兼容性介绍
发布时间:2016-12-27 来源:查字典编辑
摘要:以前的兼容.transparent_class{-ms-filter:"progid:DXImageTransform.Microsoft....

以前的兼容

<span>.transparent_class</span> <span>{

<span><span>-ms-filter</span>:<span><span>"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"</span>;</span></span> <span>/* ie8 */</span>

<span><span>filter</span>:<span><span>alpha(opacity=<span>50</span>)</span>;</span></span> <span>/* ie5-7 */</span>

<span><span>-moz-opacity</span>:<span><span>0.5</span>;</span></span> <span>/* old mozilla browser like netscape */</span>

<span><span>-khtml-opacity</span>:<span> <span>0.5</span>;</span></span> <span>/* for really really old safari */</span>

<span><span>opacity</span>:<span> <span>0.5</span>;</span></span> <span>/* css standard, currently it works in most modern browsers like firefox, */</span>

<span>}</span></span>

现在的兼容

<span>.transparent_class</span> <span>{

<span><span>-ms-filter</span>:<span><span>"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"</span>;</span></span> <span>/* ie8 */</span>

<span><span>filter</span>:<span><span>alpha(opacity=<span>50</span>)</span>;</span></span> <span>/* ie5-7 */</span>

<span><span>opacity</span>:<span> <span>0.5</span>;</span></span> <span>/* css standard, currently it works in most modern browsers */</span>

<span>}</span></span>

<!DOCTYPE html>

<html>

<head>

<style>

img

{

opacity:0.4;

filter:alpha(opacity=40); /* For IE8 and earlier */

}

img:hover

{

opacity:1.0;

filter:alpha(opacity=100); /* For IE8 and earlier */

}

</style>

</head>

<body>

<h1>图像透明度</h1>

<img src="http://www.jb51.neti/tulip_peach_blossom_w_s.jpg" alt="Peach Blossom" />

<p><b>注释:</b>在 IE 中,必须添加 <!DOCTYPE>,这样才能将 :hover 选择器用于除了 <a> 之外的其它元素。</p>

</body>

</html>

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新 Div+Css教程学习
热门 Div+Css教程学习
网页设计子分类