• 15 hours
  • Medium

Free online content available in this course.

course.header.alt.is_video

course.header.alt.is_certifying

Got it!

Last updated on 12/15/20

Avez-vous compris les bases pour réaliser vos premières animations CSS ?

Log in or subscribe for free to enjoy all this course has to offer!

Evaluated skills

  • Réaliser ses premières animations CSS

Description

Vous êtes arrivé jusqu'ici, c'est bien ! C'est même très bien !
Testons maintenant vos connaissances !

  • Question 1

    Vous avez un bouton avec une classe  .btn. Vous voulez créer une animation qui agrandit sa taille de 20 %, et qui change son  background-color  de orange à vert au survol de la souris. Laquelle de ces options écrites en Sass permet de le faire ?

    • .btn {
      background-color: orange;
      transform: scale(1);
      transition: scale, background-color 600ms;
      &:hover {
      background-color: green;
      transform: scale(1.2);
      }
      }
    • .btn {
      background-color: orange;
      transform: scale(1);
      transition: all 600ms;
      &:hover {
      background-color: green;
      transform: scale(20%);
      }
      }
    • .btn {
      background-color: orange;
      transform: scale(1);
      transition: all 600ms;
      &:hover {
      background-color: green;
      transform: scale(1.2);
      }
      }
    • .btn {
      background-color: orange;
      transform: scale(1);
      transition: scale 600ms;
      &:hover {
      background-color: green;
      transform: scale(1.2);
      }
      }
  • Question 2

    Parmi ces propositions, lesquelles sont un élément essentiel pour créer une transition CSS ?

    Careful, there are several correct answers.
    • Une propriété à animer

    • La durée de la transition

    • Un sélecteur d'ID

    • Une pseudoclasse pour déclencher l’animation

  • Question 3

    Quels principes font partie des 12 principes de l'animation ?

    Careful, there are several correct answers.
    • Primary Action (action principale)

    • Staging (mise en scène)

    • Timing

    • Anticipation