246996016-HTML5-Step-by-Step

132 Chapter 8
To apply the same formatting to an individual instance of a tag, use this:
Note The default border style is none—and that doesn’t change just because you specify a
border width and color. Don’t forget to turn a border on by including the border-style attribute
in addition to specifying the border’s color and width.
Formatting Border Sides Individually
By default, border attributes apply to all four sides of the border unless you specify
otherwise. To specify that a certain side of the border has special formatting, include the
-top, -right, -left, or -bottom argument between the word border and the property being
set. For example, to set a color other than black for the top border using a style sheet,
use the following:
p {border-style: solid; border-top-color: blue}
To apply the same formatting to an individual instance of a tag, use this:
You can use this technique not only with border-color, but with style, padding, and width
attributes as well. For example, the following rule applies a dotted line and 15 pixels of
padding to only the top and bottom of a paragraph:
Here’s how the rendered paragraph looks:
There’s a shortcut for specifying arguments for each side of the border. Rather than writing
each one out individually, you can simply include four different settings for the argument.
Specify them in clockwise order, starting at the top: top, right, bottom, left. Using
this method, the example you just saw could be written like this:
Specifying fewer than four arguments applies the formatting differently. Specifying two
arguments sets the top and bottom border attributes, while specifying three arguments
sets the top, bottom, and left/right (same settings for both) border attributes.