HTML and CSS Reference
In-Depth Information
border
This property defines in a shorthand form the width, style, and color for all four sides of an
element's border.
Syntax
border: border-width border-style border-color
where
border-width
sets all borders in numeric measurements or with a named value of
thin
,
medium
, or
thick
. The second value,
border-style
, is used to set the style of the
border and is set to a value of
dashed
,
dotted
,
double
,
groove
,
hidden
,
inset
,
none
,
outset
,
ridge
, or
solid
. Finally,
border-color
is used to set the color of the border
using a CSS color value.
Examples
div {border: 2px double red;}
.dashed {border: .5em dashed #f00;}
Compatibility
CSS 1, 2, 3 IE 4, 5 (buggy), 5.5+ Netscape 4 (buggy), 6+, Firefox 1+ Opera 4+, Safari 1+
Note
• To set the individual sides of an element's border, use the various rules that pertain
to individual borders, like
border-bottom
,
border-bottom-color
,
border-
bottom-style
,
border-bottom-width
.
border-bottom
This property defines in a shorthand form the width, style, and color for the bottom border
of an element.
Syntax
border-bottom: border-width border-style border-color;
Example
#redbottom {border-bottom: thin solid red;}
Compatibility
CSS 1, 2, 3
IE 4+
Netscape 6+, Firefox 1+
Opera 4+, Safari 1+
Note
• Given that CSS1 did not support
border-bottom-color
and
border-bottom-
style
, this property is useful for setting the characteristics of the bottom of boxes
for older browsers.
