Book HomeCascading Style Sheets: The Definitive GuideSearch this book Saturday 25th of October 2014 03:23:41 PM


The subject of this book is, as you might have guessed by the cover, Cascading Style Sheets (CSS). There are two "levels" to CSS; these are referred to as CSS1 and CSS2. The difference between the two is that CSS2 is all of CSS1, plus a lot more. This book attempts to cover all of CSS1, and CSS positioning, which is a part of CSS2. The rest of CSS2 is excluded because, at the time of this writing, nobody had implemented most of it. Rather than cover a lot of theoretical territory, we chose to stick to what was currently usable.

If you are a web designer or document author interested in sophisticated page styling, improved accessibility, and saving time and effort, then this book is for you. All you really need before starting the book is a decent knowledge of HTML 4.0. The better you know HTML, of course, the better prepared you'll be. You will need to know very little else in order to follow this book.

It is important to remember something about web standards and books: the former are continually evolving, while the latter are frozen in time (until the next edition comes out, anyway). In the case of HTML and CSS, there are a great many changes afoot even as these words are being written. The recent formalization of XHTML 1.0 as a full W3C Recommendation, for example, is a major milestone in the evolution of the World Wide Web. There are likely to be even more levels to CSS, further extending the ability to style documents; major web browsers are approaching full CSS1 support, and robust CSS2 implementations can be seen lurking on the horizon. This is an exciting time to be a designer, and learning CSS now will give you a leg up on the future.

0.1. Typographical Conventions

The following typographical conventions are used in this book:

Constant width

is used to indicate code examples, HTML tags and CSS elements.

Constant width italic

is used for replaceables that appear in text.


is used to introduce new terms and to indicate URLs, filenames, and pathnames.


indicates a note or tip relating to the nearby text.


indicates a warning.

can't see it. Note the difference between this anddisplay: none. In the lattercase, the element is not displayed and is removed from the documentaltogether so that it doesn't have any effect on documentlayout. Figure 9-14 shows a document in which anEM element has been set to behidden, based on the following styles and markup:

EM.trans {visibility: hidden; border: 3px solid gray; background: silver;padding: 1em;}

Library Navigation Links

Copyright © 2002 O'Reilly & Associates. All rights reserved.

lists the entire directory's contents.  You should name the top-level page of your website "index.html" to prevent this.  Then you can refer to your website with a nice compact URL like ""
  The University of Delaware <A HREF="">
Spatial Analysis Lab</A>, is a proud sponsor of this website.
  The animated GIF image is also a link.  By Getting on top

Employing vertical-align:top has pretty muchthe opposite effect of bottom . Likewise,vertical-align: text-top is thereverse of text-bottom . Figure 4-36 shows how the following markup would berendered:

IMG.up {vertical-align: top;}IMG.textup {vertical-align: text-top;}
Figure 7-23

Figure 7-23. An inline element with a left margin

Note the extra space between the end of the word just before the inline element, and the edge of the inline element's background. This can end up on both ends of the inline if we wish:

B {margin: 10px; background: silver;}

As expected, Figure 7-24 shows a little extra space on the right and left sides of the inline element, and no extra space above or below it.

use too many colors, will the user be too overwhelmed? If you changethe default hyperlink colors, will users still be able to figure outwhere your links are? If you set both regular text and hyperlink textto be the same color, for instance, then it will be much harder tospot links -- in fact, almost impossible if the user's linksaren't underlined.

Despite all these issues, the ability to change the colors ofelements is something almost every author will want to use, probablyquite often. Used properly, colors can really strengthen the