CSS Border 執行個體教程

邊境的CSS ，我們的個人喜愛的CSS屬性，讓您可以完全自訂的邊界附近出現的HTML元素。與HTML ，它曾經是不可能發生的邊界附近的一個要素，除了就座。的CSS邊框讓你創造清晰，定製的邊框樣式很少的工作，而陳舊的方法的HTML 。
border風格類型
有許多類型的邊框樣式在您的處置。我們建議您嘗試了許多彩色/邊界式的組合來獲得一個想法所有不同的期待您可以建立。註：我們使用的CSS類以下，因此，請檢查的CSS類的教訓，如果你不理解。

p.solid {border-style: solid; }
p.double {border-style: double; }
p.groove {border-style: groove; }
p.dotted {border-style: dotted; }
p.dashed {border-style: dashed; }
p.inset {border-style: inset; }
p.outset {border-style: outset; }
p.ridge {border-style: ridge; }
p.hidden {border-style: hidden; }

這也許是顯而易見的，但是預設的邊界風格設定的一個因素是隱藏的。

邊框寬度 border-width
改變厚度的邊境使用的邊界寬度屬性。您可以使用關鍵的字詞或確切值來界定的邊界寬度。注意：您必須確定一個邊界風格的邊界出現。現有條件：薄，中，厚。

table { border-width: 7px;
border-style: outset; }
td { border-width: medium;
border-style: outset; }
p { border-width: thick;
border-style: solid; }

邊框顏色 border-color
現在的創造性方面的CSS國界！利用邊界顏色屬性，你將能夠建立定製的邊界，以適應流動和布局，您的網站上。邊框的顏色可以是任何顏色定義的RGB ，十六進位，或關鍵術語。下面是一個例子，其中每一個類型。

邊防：邊防（方向）
如果您想建立一個邊境上只有一方的一個HTML元素，或者有一個獨特的尋找各自的邊界，然後使用邊界（方向） 。選擇的方向當然是：上，右，底部，離開。的CSS可以讓你對待每一側的邊界分別從其他三個方面。每一方都可以有其自己的顏色，寬度和風格設定，如下所示。

p { border-bottom-style: dashed ;
border-bottom-color: yellow;
border-bottom-width: 5px; }

h4 { border-top-style: double;
border-top-color: purple;
border-top-width: thick; }

h5 { border-left-style: groove;
border-left-color: green;
border-left-width: 15px;
border-bottom-style: ridge;
border-bottom-color: yellow;
border-bottom-width: 25px; }

邊防：所有在一
雖然這是很好的CSS讓網頁開發人員必須非常具體的建立自訂邊界，有時它只是更容易，更少頭痛建立一個統一的邊界，都在單一的CSS代碼。大多數的邊界上看到Tizag建立以這種方式。

p { border: 20px outset blue ;}
h4{ border: 5px solid; }
h5{ border: dotted; }