（1）transform

transform 的四個rotate、scale、skew和translate屬性，

支持的瀏覽器
Safari 3.1+、 Chrome 8+、Firefox 4+、Opera 10+、IE9+；

兼容性寫法：

transform: rotate(45deg) scale(1.5) translate(150px, 200px);

-webkit-transform: rotate(45deg) scale(1.5) translate(150px, 200px);   
 /* for Chrome || Safari */

-moz-transform: rotate(45deg) scale(1.5) translate(150px, 200px);
 /* for Firefox */

-ms-transform: rotate(45deg) scale(1.5) translate(150px, 200px);       
 /* for IE */

-o-transform: rotate(45deg) scale(1.5) translate(150px, 200px); 
/* for Opera */

（2） box-shadow

支持的瀏覽器
Safari 4+、 Chrome 2.0.x、Firefox 3.5+、Opera 10.6+、IE9+；
語法：

E {box-shadow: <length> <length> <length>?<length>?||<color>}
也就是：
E {box-shadow:inset x-offset y-offset blur-radius spread-radius color}
換句說：
對象選擇器 {box-shadow:投影方式 X軸偏移量 Y軸偏移量 陰影模糊半徑 陰影擴展半徑 陰影顏色}

box-shadow屬性至多有6個參數(shù)設置，他們分別取值：
陰影類型：此參數(shù)是一個可選值，如果不設值，其默認的投影方式是外陰影；如果取其唯一值“inset”,就是將外陰影變成內(nèi)陰影，也就是說設置陰影類型為“inset”時，其投影就是內(nèi)陰影；
X-offset:是指陰影水平偏移量其值可以是正負值可以取正負值，如果值為正值，則陰影在對象的右邊，反之其值為負值時，陰影在對象的左邊；
Y-offset:是指陰影的垂直偏移量，其值也可以是正負值，如果為正值，陰影在對象的底部，反之其值為負值時，陰影在對象的頂部；
陰影模糊半徑：此參數(shù)是可選，，但其值只能是為正值，如果其值為0時，表示陰影不具有模糊效果，其值越大陰影的邊緣就越模糊；
陰影擴展半徑：此參數(shù)可選，其值可以是正負值，如果值為正，則整個陰影都延展擴大，反之值為負值是，則縮小
陰影顏色：此參數(shù)可選，如果不設定任何顏色時，瀏覽器會取默認色，但各瀏覽器默認色不一樣，特別是在webkit內(nèi)核下的safari和chrome瀏覽器將無色，也就是透明，建議不要省略此參數(shù)。

例子

效果一:單邊效果

box-shadow: -2px 0 0 green, //左邊陰影
            0 -2px 0 blue, //頂部陰影
            0 2px 0 red, //底部陰影
            2px 0 0 yellow; //右邊陰影

box-shadow1.png

box-shadow: 0 0 5px rgba(250,0,0,0.5);

box-shadow2.png

（3） opacity

所有瀏覽器都支持 opacity 屬性。
IE8 以及更早的版本支持替代的 filter 屬性。例如：
filter:Alpha(opacity=50)。