HTML Referenzhandbuch

HTML Tag-Übersicht

HTML link media Attribute

link media Attribute bestimmt, für welche Medienart das Zielressource/Geräte optimiert, dieser Attribute wird in der Regel mit CSS-Stylesheets verwendet, um verschiedene Medienarten unterschiedliche Stile zuzuweisen.

　HTML <link> Tag

Online-Beispiel

zwei verschiedene Medienarten (Bildschirm und Druck) zwei verschiedene Stylesheets:

Beispiel

!DOCTYPE html>
<html>
<head>
<meta charset="utf-8>
<title>Verwendung des HTML <link> hreflang Attributes-Grundlagenanleitung(oldtoolbag.com)</title>
<link rel="stylesheet" type="text/css" href="demo_screen.css">
<link rel="stylesheet" type="text/css" href="demo_print.css" media="print">
</head>
<body>
<h1>oldtoolbag.com Beispiel</h1>
<p><a href="tryhtml_link_media.html" target="_blank">Klicken Sie hier</diese Seite in einem neuen Fenster öffnen (ohne "tryit"-Teil).</p>
<p>Wenn Sie diese Seite drucken oder sie im Druckvorschau-Modus öffnen, sehen Sie, dass sie mit dem Stil "media = "print"" formatiert ist. "Druck"-Stil enthält schwarzen Text auf weißem Hintergrund.</p>
</body>
</html>

Testen Sie heraus ‹/›

Browserkompatibilität

IEFirefoxOperaChromeSafari

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

Definition und Verwendung

Das media-Attribut bestimmt, für welche Medien das Zielressource optimiert ist/Das Gerät wurde optimiert.

Dieses Attribut wird normalerweise mit CSS-Stilblättern verwendet, um verschiedene Medienarten verschiedene Stile zuzuweisen.

Das media-Attribut kann mehrere Werte akzeptieren.

HTML 4.01 mit HTML5Unterschiede

Das media-Attribut unterstützt jetzt mehr Werte.

Syntax

<link media="Wert>

Mögliche Operatoren

Wert	Beschreibung
and	Regelung eines AND-Operators.
not	Regelung eines NOT-Operators.
,	Regelung eines OR-Operators.

Gerät

Wert	Beschreibung
all	Standard. Gilt für alle Geräte.
aural	Sprachsynthese.
braille	Blindenschriftgerät.
handheld	Handheld-Gerät (kleiner Bildschirm, begrenzte Bandbreite).
projection	Projektor.
print	Druckvorschau-Modus/Druckseite.
screen	Computerscreen.
tty	Telegraphie und ähnliche Medien mit einem gleich breiten Zeichengitter.
tv	Fernsehgerätstyp Gerät (niedrige Auflösung, begrenzte Bildlauffähigkeit).

Wert

Wert	Beschreibung
Breite	Regelung der Breite des Zielbildschirmbereichs Can use "min-" and "max-" prefix. Example: media="screen and (min-Breite:500px)"
Höhe	Regelung der Höhe des Zielbildschirmbereichs Can use "min-" and "max-" prefix. Beispiel: media="screen and (max-Höhe:700px)"
Gerät-Breite	Specifies the target display/Papierbreite. Can use "min-" and "max-" prefix. Beispiel: media="screen and (device-Breite:500px)"
Gerät-Höhe	Specifies the target display/Papierhöhe. Can use "min-" and "max-" prefix. Beispiel: media="screen and (device-Höhe:500px)"
Richtung	Specifies the target display/Papierreichtung. Mögliche Werte: "portrait" oder "landscape"。 Beispiel: media="all and (orientation: landscape)"
Verhältnis-Verhältnis	Regelung der Breite des Zielbildschirmbereichs/Höhenverhältnis。 Can use "min-" and "max-" prefix. Beispiel: media="screen and (aspect-Verhältnis:16/9)"
Gerät-Verhältnis-Verhältnis	Specifies the target display/Gerät der Papier--Breite/Gerät-Höhenverhältnis。 Can use "min-" and "max-" prefix. Beispiel: media="screen and (aspect-Verhältnis:16/9)"
color	Regelung der Bits für das Zielbildschirm./Farbe。 Can use "min-" and "max-" prefix. Beispiel: media="screen and (color:3)"
color-index	Specifies the number of colors that the target display can handle. Can use "min-" and "max-" prefix. Example: media="screen and (min-color-index:256)"
monochrome	Specifies the bits in the monochrome frame buffer/pixel. Can use "min-" and "max-" prefix. Example: media="screen and (monochrome:2)"
resolution	Specifies the target display/Pixel density of the paper (dpi or dpcm). Can use "min-" and "max-" prefix. Example: media="print and (resolution:300dpi)"
scan	Specifies the scanning method of the TV display. Possible values: "progressive" and "interlace". Example: media="tv and (scan:interlace)"
grid	Specifies 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 <link> Tag

HTML: <template> Tag