CSS/Funktionen/xywh()

Browserunterstützung
caniuse.com

Die CSS-Funktion xywh() erzeugt ein Rechteck, dessen Werte dem des SVG-rect-Elements entsprechen.

anwendbar auf

• clip-path
• offset-path

Parameter

Syntax

offset-path: xywh(0 1% 2px 3% round 0 1px 2% 3px); clip-path: xywh(1px 2% 3px 4em round 0 1% 2px 3em);

• vier Längenangaben, Prozentwerte
• optional das Schlüsselwort round
  • gefolgt von ein bis vier Längenangaben

Beispiel

offset-path: xywh(0 1% 2px 3% round 0 1px 2% 3px);
clip-path: xywh(1px 2% 3px 4em round 0 1% 2px 3em);

 

Siehe auch

• Masken und Beschneidungen
  xywh()-Funktion für Beschneidungen
• offset-path
  CSS-Animation entlang von Pfaden

Weblinks

• CSSWG.org: xywh()
• MDN: xywh()

Browserunterstützung
caniuse.com