Creating a Website: The Missing Manual, 4th Edition

Chapter 3. Building a Style Sheet

Last chapter, you learned HTML’s dirty little secret: It doesn’t have much formatting muscle. As a result, if you want your web pages to look sharp, you need to add style sheets into the page-creation mix.

A style sheet is simply a document filled with formatting rules. Browsers read these rules and apply them when they display web pages. For example, a style sheet rule might say, “Make all the headings on this site bold and fuchsia, and draw a box around each one.”

You want to put formatting instructions in a style sheet instead of embedding them in a web page for several reasons. The most obvious is reusability. Thanks to style sheets, for example, you can create a single rule to, say, format all level-3 headings a certain way. When you apply this rule to your site, it changes the appearance of every level-3 heading on every web page.

The second reason is that style sheets help you write tidy, readable, and manageable HTML files. Because style sheets handle all your site’s formatting, your HTML document doesn’t need to do that work. All it needs to do is organize your pages into logical sections.

Finally, style sheets give you more extensive formatting choices than HTML does. Using style sheets, you can control colors, borders, margins, alignment, and fonts. These formatting features are either out of reach in HTML, or they require some seriously messy markup.

In this chapter, you’ll learn how style sheets work, and how to attach one to a web page. ...