CSS/Funktionen/polygon()

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche
Browserunterstützung
caniuse.com

Die CSS-Funktion polygon() erzeugt ein Vieleck. Es handelt sich um eine grundlegende Formfunktion des Datentyps <basic-shape>.

anwendbar auf
Parameter
Syntax

polygon([<fill-rule> ] <length-percentage> <length-percentage>, ... )

  • ein oder mehrere Koordinatenpaare, von denen jedes einen Scheitelpunkt der Form darstellt.
  • optional eine Angabe der fill-rule
Beispiel 
.triangle {
 width: 400px;
 height: 400px;
 background-color: steelBlue;
 clip-path: polygon(100% 0%, 50% 50%, 100% 100%);
}
Das Element mit der Klasse triangle wird zu einem Dreieck beschnitten.
Beachten Sie: Das SVG-polygon-Element hat abweichende Attribute für Füllregeln und Punkte, und Punkte sind flexibel in Bezug auf die Verwendung von Leerzeichen und Kommas als Trennzeichen.
Die CSS polygon()-Regeln für Trennzeichen (x und y durch Leerzeichen getrennt, dann ein Komma) müssen eingehalten werden.

Siehe auch

  • Masken und Beschneidungen

    path()-Funktion für Beschneidungen

  • Pfad-Animationen

    CSS-Animation entlang von Kurven, Schleifen und elliptischen Umlaufbahnen

Weblinks

Abgerufen am 15.12.2025
von "http://wiki.selfhtml.org/wiki/CSS/Funktionen/polygon()"