從下面開(kāi)始介紹的邊框、填充和邊界都在CSS盒子中有所介紹?，F在我們就通過(guò)實(shí)驗來(lái)進(jìn)一步了解這些屬性的實(shí)際效果與作用。
我們首先來(lái)設置一個(gè)基礎的邊框，這樣可以繼續測試后續邊框的效果。點(diǎn)擊下面的按鈕即可。
通過(guò)設置CSS的border-width屬性，我們可以設置邊框的寬度。在下面的文本框里填入用像素表示的寬度，點(diǎn)擊按鈕就可以設置上面段落邊框的寬度了。
border-width: px
通過(guò)設置border-style屬性，我們可以改變邊框的樣式，試著(zhù)在下拉框中選擇邊框樣式，看看各種樣式的區別。需要注意的是，有的邊框樣式只有在邊框寬度至少有幾像素寬的時(shí)候才會(huì )比較明顯。
border-style:
通過(guò)設置CSS中的border-color屬性，我們可以設置邊框的顏色。同樣，我們除了可以用顏色名字來(lái)設置這個(gè)屬性之外，也可以用其它方法設置顏色，可以參考CSS顏色實(shí)驗。
border-color:
border也是一個(gè)省略寫(xiě)法，可以一次設置以上三個(gè)邊框屬性，順序如下：border-width、border-style、border-color。CSS單邊邊框：border-bottom、border-left、border-right、border-top
這些CSS邊框屬性和上面的border屬性是一樣的，只不過(guò)每個(gè)屬性只會(huì )設置一個(gè)方向的邊框。
這類(lèi)的屬性包括：border-bottom-color、border-bottom-style、border-bottom-width、border-left-color……指定這些屬性的方法和上面類(lèi)似。
聯(lián)系客服
