Ombre

Lezione 6 di 8 del corso Progetto CSS - Pulsante elegante di Coddy.

È una pratica comune aggiungere effetti d'ombra ai pulsanti per dare loro un aspetto rialzato e cliccabile.

Per aggiungere un'ombra in CSS, usiamo la proprietà box-shadow,

#with-shadow {
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25)
}

Sfida

Facile

Aggiungi ombre al tuo pulsante!

Suggerimento: è buona pratica usare il colore rgba(0, 0, 0, 0.25) per l’ombra (puoi giocare con l’opacità - 0.25)

Provalo tu

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

Tutte le lezioni di Progetto CSS - Pulsante elegante

1Introduzione

Introduzione Parte HTML

2Il progetto CSS

Ombre

Esercitati da solo: Playground Web