CSS: The Missing Manual, 2nd Edition

Introduction

Cascading Style Sheets—CSS for short—give you creative control over the layout and design of your web pages. Using them, you can dress up your text with eye-catching headings, drop caps, and borders, just like the ones you see in glossy magazines. You can also arrange images with precision, create columns and banners, and highlight your text links with dynamic rollover effects.

Anything that can do all that must be pretty complicated, right? Au contraire! The purpose of CSS is to streamline the process of styling web pages. In the next few pages, you’ll learn about the basics of CSS. In Chapter 1, you’ll get right to work creating a CSS-powered web page.

How CSS Works

If you’ve used styles in word processing programs like Microsoft Word or page layout programs like Adobe InDesign, CSS will feel familiar. A style is simply a rule describing how to format a particular portion of a web page. A style sheet is a set of these styles.

CSS works with HTML, but it’s not HTML. It’s a different language altogether. While HTML provides structure to a document by organizing information into headers, paragraphs, bulleted lists, and so on, CSS works hand-in-hand with the web browser to make HTML look good.

For example, you might use HTML to turn a phrase into a top-level heading, indicating that it introduces the content on the rest of the page. However, you’d use CSS to format that heading with, say, big and bold red type and position it 50 pixels from the left edge of the window. CSS ...