Menu
Coddy logo textTech

Icônes - I

Leçon 13 sur 23 du cours Slider | Projet Front-end de Coddy.

challenge icon

Défi

Facile

Ciblez le sélecteur .wrapper i (les icônes) :

 

1. Définissez la position sur absolute.

2. Définissez le top sur 50%.

3. Définissez la height et la width sur 50 pixels.

4. Définissez la couleur d'arrière-plan de votre choix.

5. Définissez le rayon de la bordure (border radius) sur 50%.

6. Définissez l'ombre de la boîte (box shadow) selon votre choix.

7. Définissez la transformation sur translateY(-50%)

8. Définissez le cursor sur pointer

9. Définissez la taille de la police (font size) de votre choix (cela modifiera la taille de l'icône).

10. Alignez le texte au centre (centre horizontalement).

11. Définissez la line-height sur 50px (centre verticalement).

12. Définissez la transition sur transform 0.1s linear

Essayez vous-même

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>

Toutes les leçons de Slider | Projet Front-end