Elipsa/ovál v CSS

V některých případech se hodí kreslit pomocí CSS – může to být rychlejší než příprava obrázku v grafickém editoru.

Kruh jde vytvořit pomocí zakulacení rohů (CSS vlastnost border-radius).

Udělat z kruhu ovál jde potom změnou proporcí elementu (poměr výšky a šířky).

Změnit šířku:

Pro vytvoření elipsy poslouží možnost uvést druhý radius za lomítko.

border-radius: 100px / 50px;
height: 100px;
width: 200px;