邊框樣式可以讓HTML元素的四邊都有邊框，並可以設置邊框的樣式和顏色。邊框樣式主要有三個樣式標籤，分別是border-style（邊框線條類型）、border-width（邊框線條寬度）、border-color（邊框線條顏色）。
border-style（邊框線條類型）
border-style樣式用於設置邊框線條類型，border-style樣式的設置採用關鍵字法，關鍵字有solid（實線邊框）、dashed（虛線邊框）、dotted（點線邊框）、double（雙線邊框）、inset（3D嵌入式邊框，效果取決於邊框的顏色值）、outset（3D突出式邊框，效果取決於邊框的顏色值）、groove（3D溝槽邊框，效果取決於邊框的顏色值）、ridge（3D脊邊框，效果取決於邊框的顏色值）。下面的HTML文檔展示了border-style的使用方法。
瀏覽器顯示效果如下圖所示。從瀏覽器的顯示效果可以看出，線條類型為inset和outset的邊框，並沒有3D效果。這是因為要顯示3D效果，還需要設置邊框的線條顏色。
border-color（邊框線條顏色）
border-color用於設置邊框的線條顏色，顏色值一般為16進位數值或使用rgb函數。在上面網頁文檔的樣式定義語句中，添加border-color樣式。
覽器顯示效果如下圖所示。從瀏覽器的顯示效果可以看出，線條類型為inset和outset的邊框，雖然設置了顏色，但3D效果依然不明顯。
border-width（邊框線條寬度）
border-width用於設置邊框線條的寬度，border-width的值可以是數值，也可以是關鍵字。關鍵字有thin（細的邊框）、medium（默認，中粗邊框）、thick（較粗邊框）。下面的網頁文檔展示了border-width的使用方法。
瀏覽器顯示效果如下圖所示。
單獨設置邊框各邊樣式
前面介紹的樣式對元素的四條邊框線都會產生作用，CSS也允許對HTML元素的四條邊框線分別設置樣式。
設置邊框線條類型的樣式標籤有border-top-style（設置頂部邊框線）、border-left-style（設置左側邊框線）、border-right-style（設置右側邊框線）、border-bottom-style（設置底部邊框線）。如下面的樣式語句，分別設置頂部邊框線為虛線、右側邊框線為實線、底部邊框線為點線、左側邊框線為實線。
設置邊框線條顏色樣式標籤有border-top-color（設置頂部邊框線顏色）、border-left-color（設置左側邊框線顏色）、border-right-color（設置右側邊框線顏色）、border-bottom-color（設置底部邊框線顏色）。如下面的樣式語句，分別設置頂部邊框線顏色為#ff0000、右側邊框線顏色為#00ff00、底部邊框線顏色為#696969、左側邊框線為顏色為#a5a890。
前面的HTML案例中，3D邊框效果不明顯，下面分別設置各邊邊框顏色。網頁代碼如下。
瀏覽器顯示效果如下圖所示。
設置邊框線條寬度樣式標籤有border-top-width（設置頂部邊框線寬度）、border-left- width（設置左側邊框線寬度）、border-right- width（設置右側邊框線寬度）、border-bottom- width（設置底部邊框線寬度）。如下面的樣式語句，分別設置頂部邊框線寬度為1像素、右側邊框線寬度為3像素、底部邊框線寬度為6像素、左側邊框線寬度為9像素。
邊框樣式簡寫
CSS提供了邊框樣式的簡寫標籤，樣式標籤是border，可以在border中分別設置邊框線條寬度、邊框線條類型和邊框顏色。例如下面的樣式語句定義了邊框線條寬度為1px、邊框線條類型為solid、邊框顏色為#FF0000的邊框樣式。
border-style標籤也可以簡式定義樣式，如下面的樣式語句定義了頂部邊框線條類型為dotted、右側邊框線條類型為solid、底部邊框線條類型為double、左側邊框線條類型為dashed，定義順序分別是上、右、底、左。
下面的樣式語句定義了頂部邊框線條類型為dotted、左、右側邊框線條類型為solid、底部邊框線條類型為double，定義順序分別是上、左右、底。
下面的樣式語句定義了頂部和底部邊框線條類型為dotted、左側和右側邊框線條類型為solid，定義順序分別是上下、左右。
上面的例子使用了border-style。同理，border-width和border-color也可以使用簡式樣式定義。