HTML <area> media-Eigenschaft
Definition und Verwendung
media
Die Eigenschaft legt fest, für welche Medien oder Geräte das verknüpfte Dokument optimiert ist.
Diese Eigenschaft wird verwendet, um zu bestimmen, ob die Ziel-URL speziell für spezielle Geräte (wie iPhone), Sprach- oder Druckermedien entworfen ist.
Diese Eigenschaft kann mehrere Werte akzeptieren.
nur href-Eigenschaft verwendet.
Hinweis:Diese Eigenschaft ist rein suggestiv.
Beispiel
Die media-Eigenschaft wird verwendet, um die Medien/geräte zu spezifizieren, für die der Ziel-URL optimiert ist:
<map name="planetmap"> <area shape="rect" coords="0,0,114,576" alt="Sonne" href="sun.html" media="screen and (min-color-index:256)" </map>
Syntax
<area media="value>
Mögliche Operator
Operator | Beschreibung |
---|---|
and | Bestimmt den AND-Operator. |
not | Bestimmt den NOT-Operator. |
, | Bestimmt den OR-Operator. |
Gerät
Wert | Beschreibung |
---|---|
all | Standard. Geeignet für alle Geräte. |
aural | Sprachsynthese. |
braille | Brailleschrift-Feedback-Gerät. |
handheld | Handheld-Geräte (kleiner Bildschirm, begrenzte Bandbreite). |
projection | Projektor. |
Druckvorschau-Modus/Druckseite. | |
screen | Computerbildschirm. |
tty | Telegraphie-Typewriter und ähnliche Medien mit einer Breitengitterzeile. |
tv | Fernsehgerätetypen-Geräte (niedrige Auflösung, begrenzte paginierungsfähigkeit) |
Wert
Wert | Beschreibung |
---|---|
width |
Bestimmt die Breite des Zielbildschirms. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (min-width:500px)" |
height |
Bestimmt die Höhe des Zielbildschirms. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (max-height:700px)" |
device-width |
Bestimmt die Breite des Zielbildschirms/Papieres. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (device-width:500px)" |
device-height |
Bestimmt die Höhe des Zielbildschirms/Papieres. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (device-height:500px)" |
orientation |
Bestimmt die Richtung des Zielbildschirms/Papieres. Mögliche Werte: "portrait" oder "landscape" Beispiel: media="all and (orientation: landscape)" |
aspect-ratio |
Bestimmt das Verhältnis von Breite/Höhe des Zielbildschirms. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (aspect-ratio:16/9)" |
device-aspect-ratio |
Bestimmt das Verhältnis von device-width/device-height des Zielbildschirms/Papieres. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (aspect-ratio:16/9)" |
color |
Bestimmt die Anzahl der Bits pro Farbe des Zielbildschirms. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (color:3)" |
color-index |
Bestimmt die Anzahl der Farben, die das Zielbildschirm verarbeiten kann. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (min-color-index:256)" |
monochrome |
Bestimmt die Anzahl der Pixelbits pro Pixel im monochromen Framebuffer. Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="screen and (monochrome:2)" |
resolution |
Bestimmt die Pixel-Dichte des Zielbildschirms/Papiers (dpi oder dpcm). Verwendbare Präfixe sind "min-" und "max-". Beispiel: media="print and (resolution:300dpi)" |
scan |
Bestimmt die Scanmethode des TV-Bildschirms. Mögliche Werte sind: "progressive" und "interlace". Beispiel: media="tv and (scan:interlace)" |
grid |
Bestimmt, ob das Ausgabegerät ein Gitter oder ein Raster ist. Mögliche Werte: "1" für Gitter, "0" für andere. Beispiel: media="handheld and (grid:1)" |
Browserkompatibilität
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Unterstützung | Unterstützung | Unterstützung | Unterstützung | Unterstützung |