Text Properties

The following properties affect how text is formatted on a Web page. Since most of the properties in this category are inherited, you don't necessarily have to apply them to tags specifically intended for text (like the <p> tag). You can apply these properties to the <body> tag, so that other tags inherit and use the same settings. This technique is a quick way to create an overall font, color, and so on for a page or section.

color (inherited)

Sets the color of text. Since it's inherited, if you set the color of the <body> tag to red, for example, all text inside of the body—and all other tags inside the <body> tag—is red, too.

  • Values: any valid color value

  • Example: color: #FFFF33;

Note

The preset link colors for the <a> tag override color inheritance. In the above example, any links inside the <body> tag would still be standard hyperlink blue. See Section 9.1 for ways to change preset link colors.

font (inherited)

This is a shortcut method for cramming the following text properties into a single style declaration: font-style, font-variant, font-weight, font-size, line-height, and font-family. (Read on for the individual descriptions.)

You must separate each value by a space and include at least font-size and font-family, and those two properties must be the last two items in the declaration. The others are optional. If you don't set a property, the browser uses its own preset value, potentially overriding inherited properties.

  • Values: Any value that's valid ...

Get CSS: The Missing Manual 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.