Construire des boutons CSS3 pratiques impressionnants

Deux fois par mois, nous revoyons certains des articles préférés de nos lecteurs au cours de l'histoire de Nettuts +. Ce tutoriel a été publié pour la première fois en mai 2010.

Il est désormais possible de créer des images d'arrière-plan et des icônes autrefois nécessaires avec du CSS pur. Parce que les navigateurs modernes ont accès à des zones telles que l'ombre de la boîte, les dégradés, les coins arrondis, les ombres du texte et les polices, nous pouvons enfin en tirer parti et supprimer tout besoin d'images lors de la création d'éléments visuels, tels que des boutons! Je vais vous montrer comment dans le tutoriel vidéo d'aujourd'hui.


Didacticiel vidéo


Code final

     CSS3 Badges publicitaires     Suis moi   

Conclusion

La vérité est qu'il serait probablement plus judicieux d'utiliser une petite image pour l'icône Twitter-bird. Mais l'objectif était d'obtenir cet effet avec tous les CSS! Qu'est-ce que tu penses?