Cascading Style Sheets: The Definitive Guide

Media Types and @-rules

Don’t get too excited yet. We aren’t talking about media types in the sense of things like audio and video authoring. Well, not exactly, anyway. We’re talking about creating rules for presentation within various kinds of media. The defined types of media thus far are:

• screen, as in a computer screen

• print, for things like printouts and print-preview displays

• projection, for projected presentations such as slide shows

• braille and embossed, for tactile feedback devices and printers

• aural, for speech generators

• tv, for television-type displays (think WebTV)

• tty, for fixed-width character displays

• handheld , for palmtop computers

• the ubiquitous all

These are all values of @media, one of several new @-rules. Some others are:

• @font-face, which is used in the definition of a font by manual means

• @import, which has more power than under CSS1 by allowing authors to associate media types with @import statements; for example, @import (print.css) print;

• @page, which allows you to define the styles of a page when using paged-media style sheets; for example, @page {size: 8.5in 11in;}

Paged Media

Since I just brought up paged media, I should probably mention that there are some new properties that apply to such media. Five of them apply to page breaks and where they appear:

page-break-before
page-break-after
page-break-inside
orphans
widows

The first two are used to control whether a page break should appear before or after a given element, and the latter two are common ...