Opacity 透明度
透明度属性是 CSS 中非常常用和流行的一个属性，目前已经广泛被主要浏览器支持，可惜的是 IE6/7/8 均不支持该属性。虽然 IE 没有支持这个 CSS 属性，但是我们可以通过使用 IE 特有的滤镜 filter 属性来实现相同效果。
建议IE下的滤镜CSS在头部这样写

<!--[if IE]>
    <link rel="stylesheet" href="css/ie.css">
<![endif]-->

以下用的代码都可写在ie.css中

border-radius圆角/Box Shadow盒阴影/Text Shadow文字阴影

在IE中可以利用Vector Markup Language (VML)和javascript来实现这些效果，参见IE-CSS3，在引用了一个HTC文件后，在IE浏览器中就可以使用这三种CSS3属性了。

   -moz-border-radius: 15px; /* Firefox */    
   -webkit-border-radius: 15px; /* Safari 、Chrome */    
   border-radius: 15px; /* Opera 10.5+, IE6+ 使用 IE-CSS3*/    
   -moz-box-shadow: 5px 5px 5px #000; /* Firefox */    
   -webkit-box-shadow: 5px 5px 5px #000; /* Safari、Chrome */    
   box-shadow: 5px 5px 50px #000; /* Opera 10.5+，IE6+ 使用 IE-CSS3 */    
   behavior: url(ie-css3.htc); /*引用ie-css3.htc */

实际上，在IE中有滤镜来实现阴影(shadow)和投影(drop-shadow)效果的

shadow会产生连续、渐变的阴影

filter: progid:DXImageTransform.Microsoft.Shadow(color='#000000', Direction=145, Strength=10);    

drop-shadow产生的阴影没有明暗变化 filter:progid:DXImageTransform.Microsoft.DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1");    

滤镜似乎和现有的htc脚本有冲突，或者可以称之为特性：两者同时在一个元素上启用的时候，滤镜效果会转移到其子元素上

textShadow() 方法还可以填入一个 JavaScript 对象参数，如下所示：

属性名类型默认值默认值

Gradients渐变

CSS3 中的渐变色为渐变背景色提供了很大的方便，我们不必为了渐变的背景色使用大量细小的图片，同时也不用为了适应浏览器分辨率做很多工作。尽管 IE 浏览器还是不支持该属性，我们依然可以通过 IE 是由的滤镜属性实现该效果。
IE浏览器中实现渐变色代码

background-image: -moz-linear-gradient(top, #81a8cb, #4477a1); /* Firefox 3.6 */
background-image: -webkit-gradient(linear,left bottom,left top,
color-stop(0, #4477a1),color-stop(1, #81a8cb)); /* Safari & Chrome */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,
startColorstr='#81a8cb', endColorstr='#4477a1'); /* IE6 & IE7 */
-ms-filter:"progid:DXImageTransform.Microsofkt.gradient(GradientType=0,
startColorstr='#81a8cb', endColorstr='#4477a1')"; /* IE8 */

我们可以使用 IE 的私有的滤镜来实现该效果。其中 GradientType 可以有两个选项值 0 和 1，分别代表水平渐变和垂直渐变。startColorstr 和 endColorstr 分别代表渐变开始的颜色值和结束的颜色值。虽然参数和功能不如 CSS3 中的渐变多，但是对已一般的需求来说也算够用了。另外该滤镜属性在 IE6/7 和 IE8 中支持的语法不相同，因此我们需要写不同的代码去做 IE6/7 和 IE8 的兼容处理。

IE浏览器中滤镜实现RGBA 颜色效果

CSS3 中提供了另一种方式设置背景透明度，那就是 RGBA 颜色。RGBA 颜色使得开发人员在指定颜色时，不仅可以指定 R、G、B 三原色的值，同时还可以指定颜色的透明度。这样我们就就可以在浏览器中实现类似 Windows7 中一样透明的玻璃效果，这大大增强了 Web 程序的视觉感官体验。在 IE 全系列浏览器中依然不支持 RGBA 颜色，我们只能利用 IE 滤镜模拟实现这样的效果。

IE浏览器RGBA颜色实现代码

background: rgba(50, 95, 224, .3);
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4B6287a7', endColorstr='#4B6287a7');

DXImageTransform.Microsoft.gradient滤镜里的startColorstr参数值是#AARRGGBB形式的，其中的AA是代表不透明度的十六进制，00表示完全透明，FF就是全不透明，化成十进制的范围就是0~255，剩下的RRGGBB就是颜色的十六进制代码。例子中background: rgba(125, 0, 0, .3);表示的是30%不透明度的红色背景。如何把30%的不透明度转换成十六制呢？很简单，先计算#AA的的十进制x，x/255 = 3/10，解得x=3*255/10，然后再把x换算成十六进制，约等于4B。

RGBa颜色还可以用于border，不过，不同的浏览器对于border的RGBa支持不太一样，不过唯一的不同是，Firefox在border的拐角处会出现叠加，比如透明度是0.4，那么在Firefox中，四个角的透明度会变成0.8，而支持RGBa的非FF浏览器不会出现这种情况。

Tranformations/rotate旋转元素

IE中有两个滤镜可以实现元素的旋转，BasicImage和Matrix，前者简单方便但是只能做90*n(n∈{1,2,3,4})度的旋转；Matrix滤镜功能强大，但是参数复杂。

-moz-transform: rotate(180deg);  /* FF3.5+ */
-o-transform: rotate(180deg);  /* Opera 10.5 */
-webkit-transform: rotate(180deg);  /* Saf3.1+, Chrome */
 
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
filter:progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand',M11=-1, M12=-1.2246063538223772e-16, M21=1.2246063538223772e-16, M22=-1);