Book HomeCascading Style Sheets: The Definitive GuideSearch this book Friday 29th of July 2016 06:00:18 AM


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 be inherited by all the descendants of the element. That's as it should be, of course, but Navigator takes it one step too far. Given the following:

<P STYLE="font-weight: normal;">This is a paragraph which contains a
<B>boldface element</B>, but Navigator 4 won't make the text bold.</P>

That's right: all of the text in the example paragraph will have a normal font weight. For some reason, Navigator 4 doesn't know that it should assign a font-weight of bold (or bolder) to 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.

Library Navigation Links

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

find some ordinarystyles. What theymean doesn't actually matter for this discussion, although youcan probably guess that they set H1 elements to bemaroon and BODY elements to have a yellowbackground.

Styles such as these comprise the bulk of any embedded stylesheet -- style rules both simple and complex, short and long. Itwill be only rarely that you have a document where the

8.2.2. Horizontal Formatting

In contrast to vertical formatting, horizontal formatting can get a little complicated. Fortunately, it starts out simply enough; it's only when you start putting things together that the situation becomes difficult.

On the other hand, you might decide that there should be a subtledifference between EM and I:

P {font-style: normal;}EM {font-style: oblique;}I {font-style: italic;}

If you look closely at Figure 5-26, you'll seethere is no apparent difference between the EM andI elements. In practice, not every font is sosophisticated as to have both an italic face and an oblique face, and

Only the first and third paragraphs match the rule because they arechildren of BODY. The second paragraph is a childof DIV, and therefore a grandchild ofBODY, so it does not match the rule.

Child selectors must have at least two or more selectors separated bythe > symbol. It is possible to make a childselector part of a contextual selector as well:

DIV OL>LI EM {color: purple;}
implemented quickly. Therefore, while you might not be able to doeverything described here as soon as you read this, expect most (ifnot all) of this to be included in browsers released in the year 2000or later.

First, in addition to the existing selector mechanisms likecontextual selectors, we have several new selector symbols that willmake it a lot easier to construct very specific, very sophisticatedselections -- without having to resort to sprinkling classes orIDs throughout the whole document.