css透明背景兼容方案
css透明是一个技术活，因为这里面涉及到了IE8及以下版本不兼容opacity这个css3属性，而filter:alpha(opacity=80)这个值则是不兼容IE6.网上比较流行的透明css是这样子写的。
.transparent_class {
/* IE 5-7 */
filter: alpha(opacity=50);
/* Netscape */
-moz-opacity: 0.5;
/* Safari 1.x */
-khtml-opacity: 0.5;
/* Good browsers */
opacity: 0.5;
}
更多还可以看我写过的这里。
这里我们使用的是整个层的一个透明，当你使用了上面这个代码之后，那里面的文字和图片都会变透明了，但有时候我们需要的知识背景颜色透明，或者背景图片的一个透明。
1.背景颜色透明
又是一个兼容问题了，IE8及以下的不支持rgba（RGBA 颜色值是 RGB 颜色值的扩展，带有一个 alpha 通道 - 它规定了对象的不透明度。），下面这个代码是网上比较流行的一个写法，支持IE系列浏览器，不过前辈的经验是少用哦。
.hex_color {
filter:progid:DXImageTransform.Microsoft.gradient(enabled=‘true‘,startColorstr=‘#7FFF0000‘, endColorstr=‘#7FFF0000‘);
}
:root .hex_color {
filter:none; /*处理IE9浏览器中的滤镜效果*/
background:rgba(255,0,0,0.5);
}
2.透明背景图片
我们都知道IE6下透明的背景图片会有默认的阴影，要解决这个问题可以有这么几种方法
第一种：使用jsDD_belatedPNG来实现，话说淘宝腾讯这些的都不用这些插件的，也许他们都是通过css来解决的吧
第二种：把图片保存为png8的格式，我们都知道png8保存的时候会有一些阴影和锯齿的影响。今天在一篇文章里面看到可以用firework来导出png8.
原文提到：
在fireworks里一定要使用导出alpha 透明的png8，而不是保存alpha
透明的png8。
步骤：
Fireworks >>文件>>导出向导
然后一步步往下会得到下图界面，保存就好了：
图示用这个保存方法解决了毛边的问题，这样就不会有是使用png8坚硬的边缘或者使用png24的蓝底问题了。但图片的半透都成了全透，所以如果图片有半透的，并且半透是需要保留的，那么现在我的办法只有使用png24格式在IE6下使用滤镜。
第三种：使用滤镜。
_filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://a.xnimg.cn/xnapp/music/images/dot_2.png"); _background: none;
第四种：除了png8之外，使用gif和jpg就是另外一种方案。可以分出IE6和其他浏览器的两种不同图片格式，图个兼容呗。
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
