在使用CSS美化網頁的時候,線條樣式經常被用到。線條樣式可以通過border屬性或者使用特定的邊框樣式屬性來實現。下面介紹一些常用的線條樣式屬性:
border:1px solid #999; /*實線邊框,灰色*/ border-dashed:1px dashed #999; /*虛線邊框,灰色*/ border-dotted:1px dotted #999; /*點線邊框,灰色*/ border-double:3px double #999; /*雙線邊框,灰色*/ border-radius:10px; /*邊框弧度為10像素的實線邊框*/ border-top:none; /*去掉上邊框*/ border-bottom:1px solid #999; /*下邊框實線灰色*/ border-left:5px solid green; /*左邊框實線綠色*/ border-right:2px dotted blue; /*右邊框點線藍色*/
除了以上示例,你還可以用CSS3中的屬性進行線條樣式的定制。比如,在使用border-radius屬性時,不僅可以調整邊框弧度,還能分別調整四個角的弧度。
border-radius:10px 5px 15px 20px; /*上左、上右、下右、下左四個角的弧度分別為10px, 5px, 15px, 20px*/ border-radius:30px; /*所有角的弧度都是30像素*/ border-top-left-radius:20px; /*左上角弧度為20px*/ border-bottom-right-radius:15px; /*右下角弧度為15px*/
總之,在美化網頁時,適度地使用線條樣式屬性會讓頁面更加美觀大方。