CSS/Funktionen/circle()

Browserunterstützung
caniuse.com

Die CSS-Funktion circle() erzeugt einen Kreis mit dem angegebenen Radius und der Position. Es handelt sich um eine grundlegende Formfunktion des Datentyps <basic-shape>.

anwendbar auf

• clip-path
• shape-outside

Parameter

Syntax

circle( <'radius'> [at <'x-position'> <'y-position'>])

• Radius
  Längenangabe, Prozentwert oder Schlüsselwort closest-side, bzw. farthest-side
• einem optionalen Schlüsselwort at mit zwei Positionsangaben, die aus einer Längenangabe, einem Prozentwert oder einem Schlüsselwort left right center top bottom

Beispiel

clip-path: circle(10% at 40% 60%);

Das Bild wird entsprechend der circle()-Funktion beschnitten.

Siehe auch

• Masken und Beschneidungen
  circle()-Funktion für Beschneidungen
• CSS/Tutorials/Ausrichtung/Shapes#shape-outside
• SVG/Element/circle

Weblinks

• CSSWG.org: the circle() notation
• MDN: circle()

Browserunterstützung
caniuse.com