CSS/Funktionen/ellipse()

Browserunterstützung
caniuse.com

Die CSS-Funktion ellipse() erzeugt ein Oval 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 ellipse( <'radius'> <'radius'> [at <'x-position'> <'y-position'>])

• Radius
  zwei Längenangaben, Prozentwerte oder Schlüsselwörter 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: ellipse(10% 20% at 40% 60%);

Das Bild wird entsprechend der ellipse()-Funktion beschnitten. Die ersten beiden Parameter geben die Radien an, die letzten beiden den Mittelpunkt der Ellipse.

Siehe auch

• 

  Beschneidungen mit clip-path

  sichtbare Bereiche von Elementen flexibel steuern

   
• Textumfluss mit Shapes
  Shapes ermöglichen interessante Layouts mit fließendem Text um grafische Objekte herum.
   

• SVG/Element/ellipse

Weblinks

• CSSWG.org: the ellipse() notation
• MDN: ellipse()
• Browser-Support: caniuse.com