Book HomeCascading Style Sheets: The Definitive GuideSearch this book Sunday 04th of December 2016 04:50:30 AM

10.9. Summary

CSS2 obviously covers a lot of ground, and exploring it in detail would probably have added at least four more chapters to this book, not to mention dramatically bulking up some of the chapters that already exist. However, since so little of CSS2 has actually been implemented at this writing, we felt it was better to provide an overview that was light on details. After all, the specification may change as implementations reveal flaws, and we'd rather stick to describing things that are fairly reliable.

For quick reference purposes, Table 10-1 gives a quick summary of everything new in CSS2.

The   character is a non-breaking space that can be used to insure line breaks don't occur between certain pairs of words in a title. 

To maintain strict control of line breaks, enclose your content in a <NOBR></NOBR> tag and then insert <BR> tags to specify exactly where you do want the line breaks to occur.  You can also include <WBR> tags to indicate where optional line breaks may occur if the line extends beyond the right edge of the browser window. 

The preferred way to control text alignment is by including an ALIGN

Table 10-1. New Properties in CSS2

New Properties in CSS2

text-shadow
font-size-
adjust
font-stretch
unicode-bidi
cursor
outline
outline-color
outline-style
outline-width
content
quotes
counter-reset
counter-increment
marker-offset
border-top-color
border-right-color
border-bottom-color
border-left-color
border-top-style
border-right-style
border-bottom-style
border-left-style
position
direction
top
right
bottom
left
z-index
min-width
max-width
min-height
max-height
overflow
clip
visibility
page-break-before
page-break-after
page-break-inside
orphans
widows
size
marks
border-collapse
border-spacing
table-layout
border-spacing
empty-cells
caption-side
speak-header-cell
volume
speak
pause-before
pause-after
pause
cue-before
cue-after
cue
play-during
azimuth
elevation
speech-rate
voice-family
pitch
pitch-range
stress
richness
speak-punctuation
speak-rate
speak-numeral
speak-time

New Pseudo-Classes and Pseudo-Elements in CSS2

:hover
:left
:right
:first
:before
:after

New @-rules in CSS2

@media
@font-face
@page

Table 10-2. New Values in CSS2

All Properties

inherit

The display Property

run-in
compact
marker
table
inline-table
table-row-group
table-column-group
table-header-group
table-footer-group
table-row
table-cell
table-caption 

The font Property

caption
icon
menu
message-box
small-caption
status-bar

The list-style-type Property

decimal-leading-zero
hebrew
georgian
armenian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
lower-greek

The color values

active-border
active-caption
app-workspace
background
button-face
button-highlight
button-text
caption-text
gray-text
highlight
highlight-text
inactive-border
inactive-caption
info-background
info-text
menu
menu-text
scrollbar
three-d-dark-shadow
three-d-face
three-d-highlight
three-d-lightshadow
three-d-shadow
window
window-frame
window-text

The vertical-align Property

length 


Library Navigation Links

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

@import statement in a document. UnlikeLINK, however, the style sheets of every@import directive will always be loaded and used.So given the following, all three external style sheets will beloaded, and all of their style rules will be used in the display ofthis document:

@import url(sheet2.css);@import url(blueworld.css);@import url(zany.css);

If either of these is the case, a few things can happen. If there is no Italic face, but there is an Oblique face, then the latter can be used for the former. If the situation is reversed -- an Italic face exists, but there is no defined Oblique face -- the user agent may not substitute the former for the latter, according to the CSS specification. Finally, the user agent can simply generate the oblique face by computing a slanted version of the upright font. In fact, this is what most often happens in a digital world, where it's fairly easy to slant a font using a simple computation.

In order to understand how lines are generated, let's firstconsider the case of an element containing one very long line oftext, as shown in Figure 8-45. Note that we'veput a border around the line; this has been accomplished by wrappingthe entire line in a SPAN element, and assigningit a border style:

SPAN {border: 1px dashed black;}
Figure 8-45

Figure 8-45. A single-line inline element

This is the simplest case of an inline element contained by a

Figure 8-6

Figure 8-6. Horizontal margins don't collapse

Almost as simple is this: the sum of the horizontal components of anonfloated block-level element box always equals thewidth of the parent. Take two paragraphswithin a DIV, for example, whose margins have beenset to be 1em. The content width (in other words,the value of width) of the paragraph, plus itsleft and right padding, borders, and margins, always add up to thewidth of the DIV 'scontent, as illustrated in Figure 8-7.