CSS3的邊框有4種樣式：

1、border-color（邊框的顏色）

一般設置邊框都有3個屬性-寬度、線的樣式、顏色，如果寬度設置了很多PX，那么就可以給邊框設置很多顏色，讓邊框顯示出漸變的效果，不過設置邊框不同顏色時只能通過border-bottom-colors，border-top-colors，border-left-colors，border-right-colors-上邊框 下邊框 左邊框 右邊框這樣逐個設置。

如：

border: 8px solid #000;
-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;
-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc

這個樣式只能被火狐3.0以上識別，別的瀏覽器顯示不出來。

2、border-image（邊框圖片）

這個樣式可以給邊框添加圖片，讓邊框的樣子更花哨，不過要設置邊框的寬度，不然看不出來。

如：

border-image:url(img/border.png) 30 30 round（ round表示平鋪）（平鋪之后的邊框是圖片大小不變，重復復制鋪滿整個邊框）
border-image:url(img/border.png) 30 30 stretch;（stretch表示拉伸）（拉伸之后的邊框是圖片中部被強行拉伸變形鋪滿整個邊框，上下左右四個角屬于盲區，這個區域的圖片沒有任何變化）

屬性還有個repeat--重復，感覺和round沒什么區別。

3、border-radius（邊框弧度）

可以把邊框四個直角變的圓滑，甚至可以變成圓形

如：

border-radius: 11px;

4、box-shadow（陰影）

可以給有固定寬高的html標簽加陰影

如：

box-shadow:5px 2px 6px #000;

（數值的含義：陰影水平偏移，陰影垂直偏移，模糊，顏色）（水平偏移和垂直偏移都可以設置負值，陰影的位置就可以在圖形的上方）