HTML and CSS Reference
In-Depth Information
where
color
is a color name, color value, or the keyword
transparent
to create an
invisible border. For example, the following style rule adds a 4-pixel red border directly
above the
address
element:
If you don't specify a
color, browsers use the
text color of the element
content.
address {
border-top-width: 4px;
border-top-color: red;
}
Setting the Border Design
CSS allows you to further defi ne the appearance of borders using the border styles
border-top-style:
style
;
border-right-style:
style
;
border-bottom-style:
style
;
border-left-style:
style
;
border-style:
top right bottom left
;
where
style
is one of the nine border styles displayed in Figure 4-38. The CSS3 specifi -
cations also include the
wavy
,
dot-dash
, and
dot-dot-dash
styles, but they have little
browser support at the time of this writing.
Figure 4-38
Border style designs
solid
dashed
dotted
double
outset
inset
groove
ridge
none
You specify styles for different sides in the same way you do for padding or margins.
For example, the style
border-style-bottom: double single;
places a double border above and below the element, and a single border on the ele-
ment's left and right edges.
