IE7透明度兼容

最近在做项目的时候，发现元素透明是经常要用到的效果。下面是我想实现的效果，文字都加了50%的透明度：

opacity.jpg

再来看一下透明度100%的对比：

opacity2.jpg

思路是：写完布局之后，直接在文字层的外框写上opacity: 0.5;
然而在360，FF，safari ，UC，Chome , Opera , IE9测试下透明效果都可以显示，可是在IE8以下就没办法实现效果了。

于是想到了IE浏览器需要用到特有的滤镜： filter:alpha(opacity) ；然而添加了滤镜filter:alpha(opacity=50);之后，IE8可以显示，可是IE7文字仍然无法透明显示。想到，可能是haslayout的原因，于是也加了IE常用的hack，添加了zoom:1；也依旧。

为了这个问题，无奈了一阵。。。

后来因为项目赶，必须面对这个问题，于是我把里面所有要用的属性都加上去了。包括文字的宽度和高度，就是这么一加，把问题给解决了。

所以在IE7实现透明效果，先写好透明属性,记得写上元素的宽度高度，下面总结自己经验和一些前辈关于浏览器透明的css写法：

.opacity{
   opacity: 0.5;             /*通用*/
   filter: alpha(opacity=0); /*IE下*/    
   -moz-opacity:0.5;         /* 老版Mozilla */
   -khtml-opacity:0.5;       /* 老版Safari */
   *width:672px;             /*IE7*/
   *height:299px;            /*IE7*/
}
至于宽度和高度无法确定的情况，使用js判断元素的宽度和高度即可