Menu
Coddy logo textTech

Icone - I

Lezione 13 di 23 del corso Slider | Progetto front-end di Coddy.

challenge icon

Sfida

Facile

Selettore .wrapper i (le icone) di destinazione:

 

1. Imposta position su absolute.

2. Imposta top su 50%.

3. Imposta height e width su 50 pixel.

4. Imposta il colore di sfondo che preferisci.

5. Imposta il raggio del bordo su 50%.

6. Imposta l'ombra del riquadro come preferisci.

7. Imposta transform su translateY(-50%)

8. Imposta cursor su pointer

9. Imposta la dimensione del carattere che preferisci (modificherà la dimensione dell'icona).

10. Allinea il testo al centro (centrandolo orizzontalmente).

11. Imposta line-height su 50px (centrandolo verticalmente).

12. Imposta la transizione su transform 0.1s linear

Provalo tu

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Scrivi qui il codice HTML -->
        <script src="script.js"></script>
    </body>
</html>

Tutte le lezioni di Slider | Progetto front-end

Esercitati da solo: Playground Web