手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >CSS 图像透明度opacity兼容性介绍
CSS 图像透明度opacity兼容性介绍
摘要:以前的兼容.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>

【CSS 图像透明度opacity兼容性介绍】相关文章:

控制css字间距和对齐方式所用属性介绍

CSS文本如何折行介绍

CSS基础教程:CSS的display属性

CSS在IE与Firefox下的兼容性

css解决覆盖父元素透明度的效果

利用CSS实现禁止双击选择页面内容的实例展示

CSS复合选择器使用介绍

CSS代码如何使图片自适应显示宽度

CSS+DIV表格背景透明内容不透明

CSS中背景background-position负值定位深入理解

精品推荐
分类导航