CSS3 圓角和陰影語法

在早期我們作網站版面最害怕遇到圓角和陰影這兩種東西，因為要用掉很多圖片拼起來才能讓頁面上面看起來像是。

不過在css3裡面已經有提供圓角和陰影的語法了，今天是2011/6/30目前的瀏覽器IE9還是不支援這兩種語法(放棄他了)，火狐和Chrome都有支援，如果你不想要讓網頁上面都是一堆破碎的圓角素材還讓你的語法亂七八糟的話可以考慮一下(反正IE看不到特效但是還不至於跑版)

今天有同事大人找到IE的解決方式了~請把瀏覽模式切換成IE9模式就可以看的到了...

box-shadow:2px 2px rgba(20%,20%,20%,0.2);

上面這段box-shadow很明顯的就是設定陰影了，2px 2px表示陰影的偏移量，至於rgba參數則是陰影的顏色和透明度

border-radius:10px;

至於border-radius這個設定就是圓角了，如果我們只給一個參數就是四個角都一樣的設定
ps:
border-radius同樣支援語法縮寫(左上10px/右上0/右下10px/左下0)