border-width
border-widthはボーダーの太さを指定するプロパティです。
border-widthには数値もしくはthin(細い)、medium(普通)、thick(太い)のキーワードが指定できます。
.target{
border-width:5px;
}
値がひとつの場合は上下左右に対して、値が2つの場合は上下、左右に対して、値が3つの場合は値が上、左右、下に対して、値が4つの場合は上、右、下、左に対して指定がされます。
下記のように指定した場合は、上辺が「10px」、左右辺が「5px」、下辺が「3px」になります。
.target{
border-width:10px 5px 3px;
}
個別に指定する場合、上辺の太さを指定したい場合はborder-top-width、 右辺の太さを指定したい場合はborder-right-width、 下辺の太さを指定したい場合はborder-bottom-width、左辺の太さを指定したい場合はborder-left-widthのプロパティで適応させることができます。
参考URL
4.3. Line Thickness: the ‘border-width’ properties - W3C
登録日 : 2014年01月27日 最終更新日 : 2014年2月3日
同じカテゴリー(Border)のエントリー
- border
- border-left
- border-bottom
- border-right
- border-top
- border-image
- border-image-repeat
- border-image-outset
- border-image-width
- border-image-slice
- border-image-source
- border-radius
- border-bottom-left-radius
- border-bottom-right-radius
- border-top-right-radius
- border-top-left-radius
- border-left-width
- border-bottom-width
- border-right-width
- border-top-width
- border-width
- border-left-style
- border-bottom-style
- border-right-style
- border-top-style
- border-style
- border-left-color
- border-bottom-color
- border-right-color
- border-top-color
- border-color