测试IE6的透明png支持方式，其实也就是使用的IE的滤镜支持，发现两个问题（#box，a均使用了背景透明滤镜）： 问题代码：
<!--
body{margin:0; background:#999;}
div#box{height:300px; width:600px; margin:0 auto; margin-top:100px; position:relative; background:#333 url(bg.png) no-repeat center center; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=corp,src="bg.png"); _background:none;}
a{position:absolute; display:block; width:80px; height:35px; line-height:35px; color:#FFF; text-align:center; top:70px; left:85px; cursor:crosshair;}
a:hover{color:#F30; background:url(bt.png) no-repeat; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=corp,src="bt.png"); _background:none;}
-->
<div id="box"><a href="http://omiga.org">omiga.org</a></div>
1、如果#box使用了透明背景滤镜，#box的宽高设置在IE6、IE7中无效，#box的尺寸会根据其背景自适应。Demo
2、如果#box使用了透明背景滤镜，#box内伪类子元素失效。Demo
如果#box没有使用透明背景滤镜，不会出现以上问题。Demo
Leave a Reply