@viewport
Zusammenfassung
Syntax
(Dieser MDN Artikel ist derzeit nur ein Abriss, ihm fehlt die vollständige Beschreibung der Syntax.)
@viewport { /* viewport-Deskriptor: viewport-Wert; */ }
Ein Zoomfaktor von 1.0
oder 100%
beschreibt kein Zooming. Größere Werte vergrößern, kleinere Werte verkleinern.
Deskriptoren
Browser sollen unbekannte Deskriptoren ignorieren.
min-width
- Verwendet für die Festlegung der Breite des Viewports, wenn das Dokument zum ersten Mal gezeigt wird.
max-width
- Verwendet für die Festlegung der Breite des Viewports, wenn das Dokument zum ersten Mal gezeigt wird.
width
- Eine Kurznotation für die Festlegung von sowohl
min-width
als auchmax-width
min-height
- Verwendet für die Festlegung der Höhe des Viewports, wenn das Dokument zum ersten Mal gezeigt wird.
max-height
- Verwendet für die Festlegung der Höhe des Viewports, wenn das Dokument zum ersten Mal gezeigt wird.
height
- Eine Kurznotation für die Festlegung von sowohl
min-height
als auchmax-height
zoom
- Legt den initialen Zoomfaktor fest.
min-zoom
- Legt den minimalen Zoomfaktor fest.
max-zoom
- Legt den maximalen Zoomfaktor fest.
user-zoom
- Steuert, ob der Anwender den Zoomfaktor ändern darf.
orientation
- Steuert die Orientierung des Dokuments (Hoch- oder Querformat).
Beispiele
@viewport { min-width: 640px; max-width: 800px; } @viewport { zoom: 0.75; min-zoom: 0.5; max-zoom: 0.9; } @viewport { orientation: landscape; }
Spezifikationen
Spezification | Status | Kommentar |
---|---|---|
CSS Device Adaptation Die Definition von '@viewport' in dieser Spezifikation. |
Arbeitsentwurf |
Browserkompatibilität
BCD tables only load in the browser
Siehe auch
<meta>
(en-US), specifically<meta name="viewport">
- Using the viewport meta tag to control layout on mobile browsers