下面我们来处理几个常见的CSS兼容性问题
一、链接的虚线框问题
二、固定定位
<a class="fixedTop" href="#"><img src="image/201406/20140603152217.png" /></a></p>
<p><a class="fixedBottom" href="#"><img src="mage/201406/20140603152217.png" /></a>
}</p>
<p>.fixedBottom {
position:fixed;
bottom:50px;
left:50%;
margin-left:500px;
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop + document.documentElement.clientHeight - 70));
}
三、png背景图片透明：for ie6
}</p>
<p>function enableAlphaImages(){
for (var i=0; i<document.all.length; i++){
var obj = document.all[i];
var bg = obj.currentStyle.backgroundImage;
var img = document.images[i];
if (bg && bg.match(/\.png/i) != null) {
var img = bg.substring(5,bg.length-2);
var offset = obj.style["background-position"];
obj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+img+"', sizingMethod='crop')";
obj.style.background = "none";
} else if (img && img.src.match(/\.png$/i) != null) {
var src = img.src;
img.style.width = img.width + "px";
img.style.height = img.height + "px";
img.style.filter ="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+src+"', sizingMethod='crop')"
img.src = "<a href="http://img.jb51.net/b/img/pixel.gif">http://img.jb51.net/b/img/pixel.gif</a>"; //替换透明PNG的图片
} } }
四、opacity透明：整个元素透明，包括元素里面的内容
<div class="opacity"><span style="color:yellow;">this is opacity text</span></div></p>
<p><div class="opacity"><span style="color:yellow;position:relative;">this is text that not opacity in ie</span></div>
opacity: 0.5;</p>
<p> font-size: 38px;
color:#fff;
}
五、rgba透明：只对背景透明，内容不会受到影响
background: rgba(0, 0, 0, 0.5);</p>
<p> font-size: 38px;
color:#fff;
}