Learning Web Design, 6th Edition

Chapter 12. Formatting Text

12

Formatting Text

In this chapter

Font properties

Web fonts

Text line settings

Text effects

Selectors: descendant, ID, and class

Specificity overview

List styles

Now that you’ve gotten your feet wet formatting text, are you ready to jump into the deep end? By the end of this chapter, you’ll have picked up over 30 additional CSS properties used to manipulate the appearance of text. Along the way, you’ll learn how to use more powerful selectors for targeting elements in a particular context and with a specific id or class name. We’ll also look at a way to calculate selector specificity.

The nature of the web makes specifying type tricky, if not downright frustrating, particularly if you have experience designing for print or even formatting text in a word processing program. There is no way to know for sure whether the font you specify will be available or how large or small the type will appear when it hits your users’ browsers. I’ll address the best practices for dealing with these challenges as we go along.

Note

As of this writing, the most recently published standard for fonts is CSS Fonts Module Level 3 (w3.org/TR/css-fonts-3/). It is also the best supported in modern browsers and is the reference version for the properties in this chapter. CSS Fonts Module Level 4 is in Working Draft status (w3.org/TR/css-fonts-4/). Although many of the features are still experimental, it’s fun to look at the spec to see where web typography is headed. ...