Matching hyphenated values

The last type of attribute selector is generally used for language matching, but it does have other uses. Any attribute selector using the symbols |= will match a value that begins with the specified value, given that the value is at the start of a hyphen-separated value. For example: Book HomeCascading Style Sheets: The Definitive GuideSearch this book Friday 24th of February 2017 01:53:07 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.

Library Navigation Links

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

usually fill the entire content area and the padding. If you set avisible border, then there will still be a gap between the paddingand the border, but otherwise you should get roughly the correcteffect.

Nonetheless, if you leave out this statement, every version ofNavigator 4.x will not extend the background color throughout theentire content box but will only place it behind the element'stext.

method we just discussed, only shorter. #6FA wouldbe the same as #66FFAA, and#FFF would come out #FFFFFF,which is the same as white. This approach issometimes called shorthand hexnotation.

One thing to watch out for is that with the hexadecimal methods,unlike the numeric methods, there are no defined clipping methods forthe hex-pair systems. If you enter an invalid value, thecan't use the shorthand font.

Now we could put headings and lists of links in separate paragraphs and then mess around with the padding, margin, and line heights of these paragraphs until they match the current look. However, it's probably easier to simply leave the paragraph and line break tags right where they are and simply SPAN the headings:

<SPAN CLASS="head">Heading</SPAN><BR>

11.2.2. Hiding Styles with @import

Thefact that Navigator 4.x understands LINK butdoesn't recognize @import statements can beturned to your advantage. Since any styles you place in an externalstyle sheet must be brought in via either LINK or

Since most of the examples and figures in the chapter (besides the previous section) have been examples of absolute positioning, we're already halfway to an understanding of how it works. Most of what remain are the details of what happens when absolute positioning is invoked.

When an element is positioned absolutely, it is completely removed from the document flow. It is then positioned with respect to its containing block, and its edges are placed using the side-offset