Slide 41 - media selector § Session 04

media selector

CSS2 defines a media selector for different media types.

link

Incorporate as part of the "link" element:

<link rel="stylesheet" type="text/css" media="all" href="screen.css" />
<link rel="stylesheet" type="text/css" media="print" href="print.css" />

@media selector

Or, use "@media" selector in style rule:

@media print {
  body { font-size: 11pt; }
}
@media screen {
  body { font-size: medium; }
}
@media print {
  div.navigation {
    display: none;
  }
  hr {
    page-break-after: always;
  }
}

media types

all: Suitable for all devices.
braille: Intended for braille tactile feedback devices.
embossed: Intended for paged braille printers.
handheld: Intended for handheld devices (typically small screen, limited bandwidth).
print: Intended for paged material and for documents viewed on screen in print preview mode.
projection: Intended for projected presentations, for example projectors.
screen: Intended primarily for color computer screens.
speech: Intended for speech synthesizers. Note: CSS2 had a similar media type called 'aural' for this purpose.
tty: Intended for media using a fixed-pitch character grid (such as teletypes, terminals, or portable devices with limited display capabilities).
tv: Intended for television-type devices (low resolution, color, limited-scrollability screens, sound available).

TOC	« previous \| Slide 41 \| next »