SVG/Attribut/preserveAspectRatio
Aus SELFHTML-Wiki
Das preserveAspectRatio-Attribut legt fest, ob das Seitenverhältnis der viewBox dem des Viewport angepasst wird
- Erlaubte Werte
ein oder zwei Angaben, durch Leerzeichen getrennt:
- genau eins der Folgenden:
none
: Seitenverhältnis wird ignoriertxMinYMin
xMidYMin
xMaxYMin
xMinYMid
xMidYMid
: vertikal und horizontal zentriertxMaxYMid
xMinYMax
xMidYMax
xMaxYMax
- höchstens eins der Folgenden (sonst wird
meet
angenommen):meet
: Die viewBox wird auf die größte Fläche skaliert, bei der nichts abgeschnitten wird (vgl.background-size:contain
).slice
: Die viewBox wird auf die kleineste Fläche skaliert, bei der die komplette Fläche bedeckt ist, auch wenn dadurch etwas abgeschnitten wird (vgl.background-size:cover
).
- genau eins der Folgenden:
- Standardwert
xMidYMid meet
- anwendbar auf
- Präsentationsattribut
nein
- mit CSS animierbar
ja
Beispiel
<svg width="500" height="400"
viewBox="0 0 250 600"
preserveAspectRatio="none">
Das Seitenverhältnis wird nicht festgelegt
Beachten Sie: Ist der erste Wert none, wird der zweite ignoriert.
Siehe auch
Weblinks
- Spezifikation (W3C): preserveAspectRatio
- MDN: preserveAspectRatio