Managing Text Styles
Regardless of the font in use, you can further modify the way text
displays by altering its decoration, spacing, and alignment. There is a
crossover between the text and font properties, though, in that effects
such as italics or bold text are achieved via the font-style
and font-weight
properties, while others, such as
underlining, require the text-decoration
property.
Decoration
With the text-decoration
property you can apply effects to text such as underline
, line-through
, overline
, and blink
. The following rule creates a new class
called over
that applies overlines to
text (the weight of over, under, and through lines will match that of
the font):
.over { text-decoration:overline; }
In Figure 18-8 you can see a selection of font styles, weights, and decorations.
Spacing
A number of different properties allow you to modify line, word,
and letter spacing. For example, the following rules change the line
spacing for paragraphs by modifying the line-height
property to be 25 percent greater,
set the word-spacing
property to 30
pixels, and set the letter-spacing
to
3 pixels:
p { line-height :125%; word-spacing :30px; letter-spacing:3px; }
Alignment
There are four types of text alignment available in CSS: left
, right
, center
, and justify
. In the following rule, paragraph text is set to full justification: ...
Get Learning PHP, MySQL, JavaScript, and CSS, 2nd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.