css3.0搶先看(四)：box-shadow創造酷炫的模糊陰影

文章來自www.css3s.cn

css3.0的background和border模組增加了個很酷的屬性box-shadow,顯然從名稱就能猜出是製造陰影製作效果的。目前只能被safari3瀏覽器所支援。大家看了下面的例子就知道是怎麼一回事了。 

例子一：

Safari 3 的使用者能在這裡看到5個像素模糊的背影

 CSS 代碼如下:

-webkit-box-shadow: 10px 10px 5px #888;padding: 5px 5px 5px 15px;

說明：-webkit-box-shadow: 10px 10px 5px #888中的參數分別表示：陰影水平位移值（可取正負值，本例中是

10px）；陰影垂直位移值（可取正負值，本例中是10px）；陰影模糊值（本例中是5px）；陰影顏色（本例是#888）。

例子二：

Safari 3 的使用者能在這裡看到純黑色的的背影
 
css代碼如下：
-webkit-box-shadow: -10px -10px 0px #000;-webkit-border-radius: 5px;padding: 5px 5px 5px 15px;
文章來自www.css3s.cn