Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

CSS - Propriété border-top-left-radius

border-top-left-radius,
border-top-right-radius,
border-bottom-left-radius,
border-bottom-right-radius.

Ces quatre propriétés définissent le rayon de l'un des angles de l'élément.

Pour une présentation plus complète des angles arrondis, reportez-vous à la propriété raccourcie border-radius.

Syntaxes.

    Les exemples de syntaxe sont donnés avec border-top-left-radius mais peuvent s'appliquer à n'importe laquelle des quatre propriétés.

  • border-top-left-radius: 10px;
    Une valeur numérique, positive ou nulle, suivie de son unité de dimension (voir les unités de dimensions en CSS). Le rayon de l'angle est défini à la valeur indiquée. La valeur par défaut est 0.
    Si l'unité est une unité de dimension absolue (px, cm...) l'angle sera arrondi suivant un quart de cercle.
  • border-top-left-radius: 30%;
    Si la valeur est exprimée en pourcentage, l'angle sera probablement arrondi suivant un quart d'ellipse. En effet les pourcentages sont calculé par rapport aux dimensions de l'élément : sa largeur et sa hauteur. A moins que l'élément ne soit carré, l'arrondi d'angle sera donc elliptique.
  • border-top-left-radius: 30px 50px;
    Deux valeurs séparées par un espace : les deux valeurs définissent un arrondi elliptique. La première valeur étant la largeur de l'ellipse et la deuxième valeur sa hauteur.
  • border-top-left-radius: inherit | initial | unset;

    Reportez-vous à la description générale de ces valeurs.

Simulateur.

border-top-left-radius :