Transitions CSS : Boutons CSS18

Cet exercice consiste à reproduire à partir d’un modèle des boutons en respectant des effets de transitions CSS

Consignes de l’exercice

Créez un nouveau document HTML.

Associez une feuille de style au document HTML.

Reproduisez le bouton ci-dessous en utilisant un lien html <a> et en respectant les effets de transition.

Aperçu du premier bouton

Reproduisez le bouton ci-dessous en utilisant un lien html <a> et en respectant  les effets de transition différents sur le mouse hover et le mouse out.

Aperçu du bouton 2

Reproduisez le bouton de l’exemple ci-dessous en utilisant un lien html <a> et un élément <span>qui contient un caractère spécial en HTML. Toujours en respectant  les effets de transition.

Aperçu du bouton 3

Reproduisez le bouton ci-dessous en utilisant un lien html <a> et en respectant  les effets de transition et notamment l’effet de flip lors du clique.

Aperç du bouton 4

Reproduisez le bouton ci-dessous utilisant uniquement un lien html <a> et en respectant  les effets de transition. Vous n’avez pas besoin de rajouter quoi que soit en plus de l’élément <a> dans votre code html.

Correction de l’exercice

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.