使用CSS3配合IE滤镜实现渐变和投影的效果

1. <!DOCTYPE>    <style>   
2. div {      width:100px;height:100px;text-align:center;   
3.   font:16px/100px '微软雅黑';color:#FFF;      /*以下是CSS3的线性渐变*/  
4.   background:-webkit-linear-gradient(top,#FD0,#C30);      background:-moz-linear-gradient(top,#FD0,#C30);   
5.   background:-o-linear-gradient(top,#FD0,#C30);    }   
6. </style>    <div>次碳酸钴</div>  

但是CSS3也是很蛋疼的东西，他需要个浏览器前缀。造成了这玩意儿得写三行。这个方法通常使用三个参数（也可用更多参数调更多色，这个以后再说）。第一个参数是渐变的方向，top是从上到下，至于left、right、bottom的效果很容易从top推倒出来我就不罗嗦了。CSS3还支持特定角度的渐变，第一个参数可以用度数比如45deg就是斜角渐变，但是这东西在IE上实现起来很困难，这里先不多说了。第二第三个参数是渐变的颜色，这个从代码上看就一目了然的。CSS3的颜色可以用rgba来实现透明，比如50%透明的红色：rgba(255,0,0,0.5)，注意透明通道的取值范围是0到1之间。
　　接下来就说说坑爹的IE，IE下需要通过渐变来实现，对于IE9那半吊子的CSS3我已经吐槽无力了，老老实实的用滤镜比较好。