邯郸市领创中等专业学校,是经河北省教育厅、邯郸市教育局批准成立的全日制中职学校。
领创新闻

CSS 跨浏览器解决方案之一透明度

时间:2013-05-28 08:22:50 发布:admin 来源:未知

浏览器的兼容性一直是web开发人员比较头痛的地方之一,众多的浏览器让我们有时无所适从。尤其是IE系列和其他的浏览器总是不兼容,我们通常要为IE6,7书写单独的CSS文件,甚至导致了CSS Hack 这一技术的流行。

下面我来谈谈,对于一些流行的CSS效果的跨浏览器解决方案。

很多程序员都很奇怪,为什么IE就是就是不支持 opacity 这个属性呢?这个问题已经存在很长很长时间了,其实 opacity 是 CSS3 的属性,虽然IE不提供支持,但是IE可以通过专用的过滤器属性提供类似的透明度设置。

是不是很奇怪,为什么 IE 就是和别人不一样呢?


Css代码
1.#myopacity {  
2.    /* other browsers */  
3.    opacity: .4;   
4.    /* this works in IE6, IE7, and IE8 */  
5.    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);   
6.    /* this works in IE8 only */  
7.    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=40)";   
8.} 
#myopacity {
    /* other browsers */
    opacity: .4;
    /* this works in IE6, IE7, and IE8 */
    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40);
    /* this works in IE8 only */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=40)";
}


实际上你只需要使用第二行,就支持所有的 IE 版本了,不过在某些场合,如果只需要给 IE8 设置透明度的话,而 IE6,7 则不需要,这种情况下,请使用第三行就好了。

在 IE 中透明度的值是 0-100 之间的整数,而在其他浏览器中则为 0-1 之间的小数。

问题点

* filter 和 -ms-filter 都是 IE 专有的 CSS 属性,它们通过不了W3C的验证的。

* 在IE中一旦设置了透明度属性,所有的子节点都会继承此透明度。

 

关键字:
友情链接

0310-8170888

工作时间(周一到周日:9:00-17:00)

扫一扫 加关注