HTML Referenzhandbuch

Vollständiges Verzeichnis der HTML-Tags

HTML style media Eigenschaft

Die media-Attribut spezifiziert, für welche Medien die CSS-Styles angepasst werden sollen/Gerate optimiert, diese Eigenschaft wird verwendet, um Stile für spezielle Geräte (z.B. iPhone), Sprach- oder Druckermedien zu spezifizieren.

　HTML <style> Tag

Online-Beispiel

Definition von Stilen für den Druck:

Beispiel

<!DOCTYPE　html>
<html>
<head>
<meta　charset="utf-8>
<title>HTML　Quellmedium　Eigenschaft verwenden-Grundlagen-Tutorial(oldtoolbag.com)</title>
<style　media="print">
h1　{color:#000000;}
p　{color:#000000;}
body　{background-color:#FFFFFF;}
</style>
</head>
<body>
<h1>oldtoolbag.com　Beispiel</h1>
<p>Wenn Sie diese Seite drucken oder im Druckvorschau-Modus öffnen, sehen Sie, dass sie mit dem media-Attribut "print" gestylt wird. Der "print"-Stil enthält schwarzen Text auf weißem Hintergrund.</p>
</body>
</html>

Testen Sie es heraus ‹/›

Browserkompatibilität

IEFirefoxOperaChromeSafari

Alle gängigen Browser unterstützen das media-Attribut.

Definition und Verwendung

Die media-Attribut spezifiziert, für welche Medien die CSS-Styles angepasst werden sollen/Das Gerät wurde optimiert.
Dieses Attribut wird verwendet, um zu bestimmen, welche Styles für spezielle Geräte (z.B. iPhone), Sprach- oder Druckermedien verwendet werden sollen.
Hinweis: Dieses Attribut kann mehrere Werte akzeptieren.

HTML 4.01 mit HTML5Unterschiede

keine.

Syntax

<style media="value>

mögliche Operatoren

Wert	Beschreibung
and	bestimmt den AND-Operator.
not	bestimmt den NOT-Operator.
,	bestimmt den OR-Operator.

Gerät

Wert	Beschreibung
all	Standard. Passt auf alle Geräte an.
aural	Sprachsynthese.
braille	Tastatur zur Rückmeldung für Blinde.
handheld	Handheld-Gerät (kleiner Bildschirm, begrenzte Bandbreite).
projection	Projektor.
print	Druckvorschau-Modus / Druckseite.
screen	Computerscreen (Standardwert).
tty	Telegraphie-Typewriter und ähnliche Medien mit einer gleich breiten Zeilenmatrix.
tv	Fernsehergerät (niedrige Auflösung, begrenzte Bildrollenfähigkeit).

Wert

Wert	Beschreibung
Breite	bestimmte Zielanzeigebreite Can use "min-" and "max-" prefix. Example: media="screen and (min-Breite:500px)"
Höhe	bestimmte Zielanzeigehöhe Can use "min-" and "max-" prefix. Beispiel: media="screen and (max-Höhe:700px)"
Gerät-Breite	Specify the target display/Papierbreite. Can use "min-" and "max-" prefix. Beispiel: media="screen and (device-Breite:500px)"
Gerät-Höhe	Specify the target display/Papierhöhe. Can use "min-" and "max-" prefix. Beispiel: media="screen and (device-Höhe:500px)"
Ausrichtung	Specify the target display/Papierausrichtung. Mögliche Werte: "portrait" oder "landscape" Beispiel: media="all and (orientation: landscape)"
Verhältnis-Verhältnis	bestimmte Zielanzeigebreite/Höhenverhältnis Can use "min-" and "max-" prefix. Beispiel: media="screen and (aspect-Verhältnis:16/9)"
Gerät-Verhältnis-Verhältnis	Specify the target display/Papiergerät-Breite/Gerät-Höhenverhältnis Can use "min-" and "max-" prefix. Beispiel: media="screen and (aspect-Verhältnis:16/9)"
color	bestimmte Zielanzeigebits/color Can use "min-" and "max-" prefix. Beispiel: media="screen and (color:3)"
color-index	Specify the number of colors the target display can handle. Can use "min-" and "max-" prefix. Example: media="screen and (min-color-index:256)"
monochrome	Specify the bits in the monochrome frame buffer/pixel. Can use "min-" and "max-" prefix. Example: media="screen and (monochrome:2)"
resolution	Specify the target display/pixel density of the paper (dpi or dpcm). Can use "min-" and "max-" prefix. Example: media="print and (resolution:300dpi)"
scan	Specify the scanning method of the TV display. Possible values: "progressive" and "interlace". Example: media="tv and (scan:interlace)"
grid	Specify whether the output device is a grid or bitmap. Possible values:"1" is for grid, otherwise it is "0". Example: media="handheld and (grid:1)"

　HTML <style> Tag

HTML: <template> Tag