Dreamweaver MX: The Missing Manual

Chapter 8. Cascading Style Sheets

When you compare the formatting options discussed in Chapter 3 with the text styling in a magazine or book, the Web looks like the ugly duckling of the media world. The handful of options available in HTML—font face, size, and color—doesn’t hold a candle to the typographic and layout control you get when creating a document in even the most basic word processing program.

But not anymore. A newer technology called Cascading Style Sheets has begun to address the shortcomings of HTML. Cascading Style Sheets (CSS) allow much greater control over the layout and design of Web pages. Using them, you can add margins to paragraphs (just as in a word processor), colorful and stylish borders to images, and even dynamic rollover effects to text links. Best of all, Dreamweaver’s streamlined approach lets you combine several of these formats into powerful style sheets with just a few mouse clicks.

Note

Cascading Style Sheets can be one of the most difficult Web-design concepts to grasp. As you read the following pages, resist the temptation to fling your monitor into the hallway until after you’ve followed the tutorial steps at the end of this chapter, which put all of the tech-talk into context.

Cascading Style Sheet Basics

If you’ve used styles in word processing programs like Microsoft Word or page layout programs like Quark XPress, Cascading Style Sheets (CSS) will feel familiar. A style is simply a rule describing how to format a particular piece of HTML. (A ...