You are previewing CSS3 Foundations.

CSS3 Foundations

Cover of CSS3 Foundations by Ian Lunn Published by John Wiley & Sons

chapter eleven

Styling Fonts and Text

In the preceding chapter you gave the Cool Shoes & Socks page some unique fonts via Google Web Fonts. With a knowledge of @font-face and third-party font services, you have access to tens of, if not hundreds of thousands of, fonts to give web pages a unique style of their own. Why stop there, though? CSS offers many ways to style fonts and text to make a page even more useful and unique.


Project files update (ch11-00): If you haven’t followed the previous instructions and are comfortable working from here onward or would like to reference the project files up to this point, you can download them from

Styling Fonts

Changing the appearance of text doesn’t end at changing the font face. If all text on a page were the same style, no matter how fancy the font, the page would look dull and wouldn’t direct the users eye particularly well. By changing attributes relating to the font, such as size, variant, weight, and so on, you can help the user determine which text is more important than other text, allowing them to scan the page quicker.


Initial value: normal | Inherited: Yes | Applies to: All | CSS2.1

Browser support: IE 4+, Firefox 1+, Chrome 1+, Opera 7+, Safari 1+

By using the font-style property, you can change the style of a font between normal, italic, and oblique. In the preceding ...

The best content for your career. Discover unlimited learning on demand for around $1/day.