Man kann Stylesheets für die unterschiedlichsten Ausgabemedien definieren. Am wichtigsten sind dabei Bildschirm und Druck.[b]
eingebunden werden die stylesheets ganz normal im <head>
<link rel="stylesheet" media="screen" href="screen.css">
<link rel="stylesheet" media="print" href="druck.css">
[b]Ausgabemedien nach CSS 2.0
* media="all"
- CSS-Datei gilt für alle Medientypen.
* media="aural"
- CSS-Datei gilt für computergesteuerte, synthetische Sprachausgabe.
* media="braille"
- CSS-Datei gilt für Ausgabegeräte mit so genannter "Braille-Zeile". Diese Form des Ausgabemediums ist für blinde Menschen gedacht.
* media="embossed"
- CSS-Datei gilt für Braille-Drucker
* media="handheld"
- CSS-Datei gilt für die Anzeige auf tragbaren Kleinstcomputern (Organizer).
* media="print"
- CSS-Datei gilt für den Ausdruck auf Papier.
* media="projection"
- CSS-Datei gilt für die Datenprojektion mit Beamern und ähnlichen Geräten.
* media="screen"
- CSS-Datei gilt für die Bildschirmanzeige.
* media="tty"
- CSS-Datei gilt für nicht-grafische Ausgabemedien mit fixer Zeichenbreite und für text-orientierte Browser wie Lynx
* media="tv"
- CSS-Datei gilt für TV-ähnliche Ausgabegeräte, die sich durch grobe Bildschirmauflösung und mangelnde Unterstützung beim Scrollen in Text, dafür aber durch Sound-Unterstützung auszeichnen.
Internet Explorer interpretiert diese Angaben ab Version 4.0 zu einem gewissen Teil
Netscape findet ab Version 6.0 die richtige Style-Sheet-Datei für Bildschirmformate, ignoriert beispielsweise Style-Sheet-Dateien mit Formaten für den Druck
möglicher css-syntax (statt <link ...>)
<head>
<style type="text/css">
<!--
@import url(druck.css) print;
@import url(screen.css) screen;
-->
</style>
</head>
----------------
Beispiel für die print.css
body, p, div, td {display:none;}
druckt keinen Text