CSS border-width 屬性使用教程
2024-07-11 08:27:29
供稿：網(wǎng)友
border-width -- 定義四個邊框的寬度
取值:<border-width>{1,4} | inherit
<border-width>{1,4}: 邊框?qū)挾?可以有一個,兩個,三個或四個值)
inherit:繼承
初始值: medium
繼承性: 否
適用于: 所有元素
border:邊框,width:寬度.
border-width的取值
thin: 細(xì)
medium: 中
thick: 粗
<length>: 長度表示法
上面的寬度值有下面的關(guān)系: thin<medium<thick
提示: border-width不能使用百分比而且不能取負(fù)值,只能使用長度.(例如:px,em等)!
示例
為border-width指定四個值
border-width:border-top-width border-right-width border-bottom-width border-left-width;
p#fourborders
{
border-width:thick medium thin 12px;
}
如果定義四個值,那么這四個值就分別是上,右,下,左邊框的寬度值(從上邊框開始,以順時針的順序遍歷).
等價于下面的定義
p#fourborders
{
border-top-width:thick;
border-right-width:medium;
border-bottom-width:thin;
border-left-width:12px;
}
為border-width指定三個值
border-width:border-top-width border-right-width/border-left-width border-bottom-width;
p#threeborders
{
border-width:thick 12px thin;
}
如果只定義三個值,中間的值代表左和右邊框的寬度.
等價于下面的定義
p#threeborders
{
border-top-width:thick;
border-right-width:12px;
border-bottom-width:thin;
border-left-width:12px;
}
為border-width指定兩個值
border-width:border-top-width/border-bottom-width border-right-width/border-left-width;
p#twoborders
{
border-width:thick 12px;
}
如果只定義兩個值,前面的值代表上下邊框?qū)挾?后面的值代表左右邊框的寬度.
等價于下面的定義
p#twoborders
{
border-top-width:thick;
border-right-width:12px;
border-bottom-width:thick;
border-left-width:12px;
}
為border-width指定一個值
border-width:border-top-width/border-bottom-width/border-right-width/border-left-width;
p#oneborders
{
border-width:thick;
}
如果只定義一個值,這個值就代表四個邊的寬度.
等價于下面的定義
p#oneborders
{
border-top-width:thick;
border-right-width:thick;
border-bottom-width:thick;
border-left-width:thick;
}
