CSS property: border
Description
Shorthand property for setting the same width, color, and style for all four borders of a box.
See border-top, border-right, border-bottom et border-left.
Syntax
border: <width> || <style> || <color>;
Values
- <width>
The border width. The lengths corresponding to
thin
,medium
andthick
are not specified, but the values are constant throughout a document andthin
≤medium
≤thick
.<length> It may not be negative. thin medium thick - <style>
The border style.
none No border. Color and width are ignored (i.e., the border has width 0, unless the border is an image, see background-image). hidden Same as none
, but has different behavior in the border conflict resolution rules for border-collapsed tables.dotted A series of round dots. dashed A series of square-ended dashes. solid A single line segment. double Two parallel solid lines with some space between them. The thickness of the lines is not specified, but the sum of the lines and the space must equal border-width. groove Looks as if it were carved in the canvas. This is typically achieved by creating a “shadow” from two colors that are slightly lighter and darker than the border-color. ridge Looks as if it were coming out of the canvas. inset Looks as if the content on the inside of the border is sunken into the canvas. Treated as ridge
in border-collapsed tables.outset Looks as if the content on the inside of the border is coming out of the canvas. Treated as groove
in border-collapsed tables.- <color>
The border color.
Versions
Examples
p { border: 1px solid #f00; }