SVG/Attribut/viewBox

Das viewBox-Attribut legt ein neues Koordinatensystem fest, das innerhalb des verfügbaren Viewports beliebig skaliert, verschoben und beschnitten werden kann.

erlaubte Werte	4 Zahlen x-Koordinate y-Koordinate Breite Höhe
default-Wert	none
erlaubt in	svg, symbol, image, marker, pattern, view,

Beispiel

<svg viewBox="-100 -100 200 200">
  <circle id="clockface" r="98" />
  <circle id="origin"    r="2" />
</svg>

Die SVG-Uhr erhält eine um 100 (dimensionslose Einheiten) verschobene ViewBox, damit spätere CSS-Animationen vereinfacht werden.

Beachten Sie: Im XML-Kontext wird das Attribut in CamelCase geschrieben, HTML5 ist case-insensitiv.

Siehe auch

• SVG/Tutorials/Einstieg/SVG in responsiven Webseiten

Weblinks

• Spezifikation (W3C): viewBox Attribute