border-color -- 定義四個邊框的顏色
取值:[ <color> | transparent ]{1,4} | inherit
<color>{1,4}: 顏色表示法
transparent{1,4}: 透明
inherit: 繼承
初始值: 同color屬性的默認值
繼承性: 否
適用於: 所有元素
border:邊框,color:顏色.
border-color和border-width的賦值方式是一樣的,可以分別賦1,2,3或4個顏色值.
示例
p#fourborders
{
border-color:red black blue green;
}
如果定義四個值,那麼這四個值就分別是上,右,下,左邊框(從上邊框開始,以順時針的順序遍歷).定義夢之都段落的上邊框為紅色,右邊框為黑色,下邊框為藍色,左邊框為綠色.
p#threeborders
{
border-color:red black blue;
}
如果只定義三個值,中間的值代表左和右邊框.定義夢之都段落的上邊框為紅色,下邊框為藍色,左,右邊框為黑色.
p#twoborders
{
border-color:red black;
}
如果只定義兩個值,前面的值代表上下邊框,後面的值代表左右邊框.定義夢之都段落的上,下邊框為紅色,右,左邊框為黑色.
p#oneborders
{
border-color:red;
}
如果只定義一個值,這個值就代表四個邊的.定義夢之都段落的邊框為紅色.
網頁教學網提示: 當不設置邊框顏色border-color時,邊框的顏色使用此元素的color屬性的值.
p#bordercolor
{
border-bottom:solid;
color:red;
}
上例中,由於沒有設定border-color的值,因此取color的值紅色.
CSS border-color 屬性示例 -- 使用color的顏色值.
網頁教學網提示: 由於CSS屬性具有覆蓋的特性,所以設置的順序很重要.
p
{
border:medium solid green;
border-bottom:solid;
color:red;
}
上例中,下邊框的顏色為紅色,其它邊框為綠色.因為border-bottom沒有設置顏色,所以應該取color指定的顏色.