Comment fonctionne border-radius
La propriété border-radius arrondit les coins d'un élément. Vous pouvez spécifier des valeurs pour les coins en haut à gauche, en haut à droite, en bas à droite et en bas à gauche dans cet ordre, en utilisant des unités de longueur ou de pourcentage.
Utiliser le générateur
Entrez des valeurs numériques ou des pourcentages pour chaque coin, et l'outil génère la règle CSS correspondante. L'aperçu se met à jour en temps réel, vous permettant de voir exactement à quoi ressemblera l'élément avant de copier le code.
Coin elliptiques avancés
Pour créer une ellipse au lieu d'un cercle, utilisez la syntaxe avec barre oblique : border-radius: 50% / 50%. Le premier ensemble de valeurs contrôle le rayon horizontal, le deuxième ensemble contrôle le rayon vertical, permettant de façonner chaque coin indépendamment.
Support des navigateurs
Tous les navigateurs modernes prennent en charge la propriété border-radius, y compris Chrome, Firefox, Safari, Edge et Opera. Aucun préfixe de fournisseur n'est requis pour les versions actuelles.
Plus de générateurs CSS
Associez des coins arrondis à un générateur CSS de text-shadow pour donner du relief à vos titres et boutons.