CATALOGUE Code & Data Formation XHTML/CSS Apprendre CSS 3 Maîtriser les Animations de Transition en CSS

Maîtriser les Animations de Transition en CSS

Exemple de transition
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre CSS 3
Revoir le teaser Je m'abonne
4,5
Transcription
Cette leçon fait partie de la formation
89,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm
DescriptionProgrammeAvis
4,5
Cette leçon fait partie de la formation
89,00€ Je commande
Formation incluse dans l'abonnement Elephorm Je m'abonne à Elephorm

Appliquer des Transitions sur les Éléments de Navigation

Objectifs

Les objectifs de cette vidéo sont de vous enseigner comment :

  • Appliquer des transitions CSS sur les éléments de navigation.
  • Configurer les propriétés de transition de manière efficace.
  • Assurer la compatibilité des transitions sur différents navigateurs.

Résumé

Apprenez à créer des animations de transition en CSS pour améliorer l'interface utilisateur de votre site web.

Description

Dans cette leçon, nous abordons la manière d'appliquer des animations de transition en CSS sur les éléments de navigation tels que les liens et les boutons. Nous commencerons par ouvrir le fichier CSS et ajouterons les propriétés de transition pour que les changements d'état se fassent de manière douce et agréable. Vous apprendrez à définir la transition-duration, la transition-delay, et la timing-function en utilisant une syntaxe compacte. Nous veillerons aussi à ce que ces transitions soient compatibles avec différents navigateurs en utilisant les prefixes nécessaires comme -webkit-transition. Enfin, nous appliquerons ces transitions à d'autres éléments HTML pour en garantir l'efficacité et l'attractivité.

Voir plus

Questions fréquentes

Pourquoi est-il important d'utiliser les prefixes pour les transitions CSS ?
Les prefixes assurent la compatibilité avec différents navigateurs, surtout les versions plus anciennes.
Quelle propriété CSS définit la durée d'une transition ?
La propriété transition-duration définit la durée d'une transition.
Que permet la fonction <code>ease-in-out</code> dans les transitions CSS ?
La fonction ease-in-out permet d'avoir une transition douce à l'arrivée et au départ.

Programme détaillé

4 commentaires
4,5
4 votes
5
4
3
2
1
pierre.hiroux
Il y a 1 an
La formation est divisée en 90 modules sans lien entre eux et sans progression pédagogique. Il faut les réorganiser par thème pour donner plus de cohérence et donner de la progression pédagogique à la formation. Multiples fautes d'orthographe dans les textes.
henridjithat
Il y a 2 ans
Très bonne formation, étant débutant j'ai beaucoup appris.
yvan.vogel
Il y a 2 ans
J'en suis arrivé au bout.. Un vrai marathon. Très longue formation, à mon avis c'est plutôt 30h de cours et non pas 15h.
Après c'est une formation hyper claire et détaillée. L'auteur a fait un panorama complêt sur le CSS3.
g.vanleynseele
Il y a 4 ans
Cours très clair et très bien expliqué! Par contre il manque la moitié des fichiers de travail !