Name

font-size

Values:

absolute size|relative size|length|percentage

Applies to:

All elements

Inherited:

Yes

As the name suggests, the font-size property specifies the size of the text element. There are four methods for specifying font size:

Absolute sizes

Values: xx-small|x-small|small|medium|large|x-large|xx-large

Example: H1 { font-size: x-large }

Absolute sizes are descriptive terms that reference a table of sizes kept by the browser.

Relative sizes

Values: larger|smaller

Example: H1 { font-size: larger }

These values specify the size of the type relative to the parent object.

Length sizes

Values: number + em|ex|px|pt|pc|mm|cm|in

Example: H1 { font-size: 24pt }

You can also specify font size using any of the length values described in Section 23.4.1 earlier in this chapter.

Percentage sizes

Values: n%

Example: H1 { font-size: 125% }

This specifies font size as a percentage of the inherited size. For instance, in this example the H1 will be 125% larger than the size of regular body text.

Get Web Design in a Nutshell 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.