基礎
你可能很熟悉邊的最基本用法。
上面的代碼將給元素應用1px的邊。即簡潔又簡單;但我們也可以稍作修改。
除了指定具體的邊框寬度值,也可以使用這三個關鍵詞:thin,medium 和 thick。
雖然乍看起來單個屬性的方式沒必要,但有極少數的情況下,當它是有利的,例如當你需要在特定的事件發生時更新邊的部分屬性。
也許你需要在用戶將鼠標懸停在一個特定的元素上時改變這個元素的邊框顏色。使用復合屬性需要重復像素值和邊的樣式。
一個更優雅的和簡潔(DRY,don’t repeat yourself)的做法是只更新邊的顏色屬性。
此外,一會你會發現,這種單個屬性的方式有助于通過CSS創建自定義的形狀。
CSS3新特性
在 CSS3 中,border 增加了兩個新的特性,一是邊框圖片,而是在邊框顏色中使用漸變色。
邊框圖片利用 border-image 屬性實現,可以為一個元素指定一個圖片作為邊框,代替傳統的線條邊框,它有五個子屬性:
設置邊框圖片的圖片地址,只有設置了這個屬性,才算是使用了邊框圖片,其值為 url() 的形式。
新聞熱點
疑難解答