Dreamweaver CS6: The Missing Manual

Cascading Style Sheet Basics

If you’ve used styles in programs like Microsoft Word or Adobe InDesign, CSS will feel familiar. A style is simply a rule describing how a browser should format a particular HTML tag. A style sheet is a collection of these styles.

You can create a single style that formats text with the font Arial, colored red, and with a left margin of 50 pixels, for example. You can also create styles specifically for images; for instance, you can create a style that aligns an image along the right edge of a web page, surrounds the image with a colorful border, and adds a 50-pixel margin between the image and the surrounding text.

Once you create a style, you can apply it to text, images, or other elements on a page. For example, you could select a paragraph of text and apply a style to it to instantly change the text’s size, color, and font. You can also create styles for specific tags, so that, for example, a browser displays all <h1> elements in the same style, no matter where they appear on your site.

Why Use CSS?

In the past, HTML alone provided basic formatting options for text, images, tables, and other web page elements. But today, professional web designers use CSS to style their pages. In fact, the older HTML tags used to format text and other page elements have been phased out by the World Wide Web Consortium (W3C), the organization that defines Web standards, in favor of CSS. Following industry practice, Dreamweaver CS6 has made it impossible to add obsolete ...