Creating Web Sites: The Missing Manual

Chapter 6. Style Sheets

Last chapter, you learned HTML’s dirty little secret—it doesn’t have much formatting muscle. If you want your Web pages to look sharp, you need to add style sheets into the mix.

Style sheets are separate documents that are filled with formatting rules. The browser reads these rules and uses them to format your Web page. For example, a style sheet rule might say, “make all headings bold and fuchsia and draw a box around each one.”

There’s several reasons that you place formatting instructions in a style sheet instead of directly in a Web page. The most obvious one is reuse. For example, thanks to style sheets, you can create a single rule that you can use with every level three heading in every Web page on your Web site. The second reason is that style sheets help you make tidy, manageable HTML. Because they do all the formatting, your HTML code doesn’t need to. All your HTML needs to do is organize the page into logical sections. (For a quick recap of the difference between structuring and formatting a Web page, refer back to Section 5.1.2.)

The formatting choices in style sheets are much more extensive (and much more overwhelming) than those in HTML alone. Using style sheets, you can control colors, borders, margins, alignment, and (to a limited degree) fonts. You’ll use style sheets in this chapter and throughout this book. As you’ll see, style sheets give you options that can jazz up the dullest HTML.

Style Sheet Basics

Style sheets are officially known as ...