一、bordercolorlight屬性
bordercolorlight是CSS2中定義的屬性。它會指定一個3D邊框的亮色區域的顏色。
在CSS3中,使用border-top-color、border-right-color、border-bottom-color、border-left-color來替代bordercolorlight,實現更細粒度的控制。
div {
border-style: solid;
border-width: 10px;
border-color: #333 #555 #777 #999;
border-color-light: #FFF;
}
二、border-color是CSS3嗎
是的,border-color是CSS3中定義的屬性。
它可以像border-width一樣,用簡寫形式同時定義上、右、下、左四個方向的邊框顏色,其中任意一個方向可以使用transparent。
div {
border: 5px solid #333;
border-color: red green blue;
}
三、bordercolor屬性設置邊框顏色
bordercolor是CSS2.1中定義的屬性,用於設置邊框顏色。
注意,它必須與border-style和border-width一起使用才有效果。
div {
border-style: solid;
border-width: 10px;
border-color: #333;
}
四、background color選擇
background-color與border-color經常一起使用,來實現漂亮的UI。
在選取background-color時,需要注意與border-color形成對比,避免過於相近造成視覺混亂。
以下是一些常用的搭配:
- 白色背景、黑色邊框
- 黑色背景、白色邊框
- 藍色背景、淺藍色邊框
- 灰色背景、暗灰色邊框
- 綠色背景、淺綠色邊框
div {
background-color: #FFF;
border: 2px solid #000;
}
五、總結
通過以上的講解,我們了解了bordercolor、bordercolorlight、border-color和background-color的用法和注意事項,希望對您有所幫助。
原創文章,作者:小藍,如若轉載,請註明出處:https://www.506064.com/zh-hant/n/270548.html
微信掃一掃
支付寶掃一掃