L'un des plus gros problèmes avec toutes les nouvelles propriétés CSS3 est que la plupart d'entre elles ont plusieurs implémentations spécifiques au navigateur. Cela signifie que lorsque vous voulez une ombre simple, vous devez vous rappeler un peu de code pour le rendre compatible avec autant de navigateurs que possible.
Pour vous aider dans cette tâche, de nombreux codeurs intrépides ont créé des outils interactifs gratuits offrant des interfaces utilisateur simples permettant de cracher tout le code dont vous avez besoin avec un résultat final entièrement personnalisable. Ci-dessous, vous trouverez plus de vingt de ces générateurs CSS3.
Générateur CSS3
Certainement l'une des options les plus populaires. Tous les effets sont entièrement personnalisables et vous pouvez choisir parmi toutes les propriétés CSS3 populaires.
CSS3 s'il vous plaît
Une autre option très populaire, celle-ci vous permet d’éditer le code comme vous le verriez dans un éditeur de code. Les modifications sont reflétées sur un graphique en haut à droite.
CSS3 Click Chart by Impressive Webs
Pas très personnalisable (il suffit de cliquer pour voir le code) mais probablement le plus complet de la liste en ce qui concerne le nombre d'effets couverts.
Boutons CSS-Tricks
Un excellent petit fabricant de boutons d'Internet avec Chris Coyier. Utilisez simplement les curseurs pour modifier les propriétés.
Rayon de la frontière
Une des options les plus élégantes pour définir un rayon de bordure. Il suffit de taper un numéro et le reste.
Générateur de kits Font Squirrel @ Font-Face
C'est de loin mon outil préféré sur la liste. Chargez une police et tout ce dont vous avez besoin pour l'intégrer à un site Web, y compris HTML, CSS et plusieurs formats de fichiers de polices. Vous voudrez certainement mettre en favori celui-ci!
Westciv
Westciv possède un certain nombre de générateurs CSS3 utiles, à la fois gratuits et faciles à utiliser. Découvrez-les ci-dessous.
- Gradients CSS3
- Ombres de texte CSS3
- Transformations CSS3
- CSS3 Texte Stroke
- Gradients radiaux CSS3
- CSS3 Box Shadows
Générateur de dégradé CSS3
Utilisez quelques menus déroulants simples et un curseur pour créer des dégradés complexes.
Widgetpad Générateur CSS3
Un autre avec plusieurs propriétés et effets à choisir.
Image de la frontière
Border-image est une nouvelle fonctionnalité CSS3 plutôt compliquée. Découvrez comment tout cela fonctionne à l'aide de cet outil.
Icônes sèches bouton générateur
Un générateur de boutons génial avec une tonne d'options.
Coins CSS
Celui-ci gère actuellement les dégradés et les angles arrondis et promet d’autres options prochainement.
CSS3 Maker
Super lisse et facile à utiliser, celui-ci gère pas mal de trucs CSS.
Générateur de coins arrondis CSS3
Encore un autre générateur de coin arrondi de base.
Générateur de menu CSS3
Celui-ci est en fait une application téléchargeable à part entière pour la création de menus CSS3 complexes avec des angles arrondis, des dégradés, etc.
Générateur de colonnes CSS3
L'un des rares générateurs de colonnes que j'ai pu trouver (Générateur CSS3 effectue également des colonnes). Celui-ci n'est pas en anglais mais reste assez facile à comprendre et le code qu'il crache est bien entendu parfaitement lisible.
Générateur de dégradé CSS3 rapide 3 couleurs
Un dernier générateur de dégradés CSS, juste au cas où les 10 ou plus ci-dessus ne satisferaient pas votre envie de dégradés.
Conclusion
J'espère que les outils ci-dessus vous aideront à apprendre à être un maître CSS3. Pour encore plus de bontés CSS3, consultez CSS-Infos et CSS3 Pie. CSS-Infos est une liste énorme de propriétés CSS avec ce que les navigateurs supportent et CSS3 Pie est une ressource pour obtenir le bon vieil IE afficher CSS3 correctement
Laissez un commentaire ci-dessous et indiquez-nous quels sont vos générateurs CSS préférés et si nous en avons omis.