J’avais déjà parlé dans mon précédent article sur l’apprentissage du HTML&CSS du Mozilla Developer Network. Ce petit coin de web mit en place par Mozilla cache plus de trésors que l’on pourrait le croire.
Aujourd’hui j’aborde son générateur de coins arrondis, outil permettant de configurer la propriété css « border-radius » dans une interface WYSIWYG (What you see is what you get = Ce que vous voyez est-ce que vous obtenez). Les générateurs de coin arrondis pullulent sur le web, mais celui là est bien foutu, autant dans son interface que dans ses fonctionnalités.
L’essentiel de l’interface est là: votre bloc est illustré par le train orange et vous pouvez régler indépendamment chaque arrondi selon son axe X et Y, soit en rentrant les valeurs dans les champs soit à la main à l’aide des poignées. Vous pouvez aussi changer l’unité de px en pourcentage, utile pour des blocs aux tailles variables et vous pouvez aussi désactiver-réactiver l’arrondi de coins en particulier.
Cet outil est donc bien pratique quand on ne connaît pas par cœur l’emplacement de chaque paramètre de la fonction border-radius, surtout quand ça doit donner quelque chose comme ça :
Accéder au Radius Generator
J’espère que d’avoir partagé cet outil en aidera, des débutants jusqu’aux plus aguerris !