Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Impara Sfida: Implementazione di Effetti Decorativi in CSS | Aggiunta di Effetti Decorativi con CSS
Fondamenti Di CSS

bookSfida: Implementazione di Effetti Decorativi in CSS

Compito

Esercitazione per migliorare l'aspetto visivo della pagina web. Il compito prevede:

  • Aggiunta di un'ombra all'elemento div con il nome classe card. I valori specificati per l'ombra sono rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
  • Aggiunta di un'immagine di sfondo all'elemento div con il nome classe card. Il link dell'immagine fornito è: https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png.
  • Centratura dell'immagine di sfondo all'interno della card.
index.html

index.html

index.css

index.css

copy
  • Per aggiungere un'ombra a un elemento, utilizzare la proprietà box-shadow con il valore specificato. In questo caso, il valore è rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
  • Per impostare un'immagine come sfondo tramite la proprietà background-image, utilizzare la sintassi url("correct path"). All'interno delle parentesi, aprire le virgolette e specificare il percorso dell'immagine. In questo compito, il percorso corretto è fornito: url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png").
  • Per determinare la posizione dell'immagine di sfondo, utilizzare la proprietà background-position. In questo caso, impostare il valore della proprietà su center.
index.html

index.html

index.css

index.css

copy

1. Quale proprietà aggiunge un'ombra attorno al riquadro di un elemento?

2. Come si può aggiungere un'immagine come sfondo di un elemento?

question mark

Quale proprietà aggiunge un'ombra attorno al riquadro di un elemento?

Select the correct answer

question mark

Come si può aggiungere un'immagine come sfondo di un elemento?

Select the correct answer

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 5. Capitolo 6

Chieda ad AI

expand

Chieda ad AI

ChatGPT

Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione

bookSfida: Implementazione di Effetti Decorativi in CSS

Scorri per mostrare il menu

Compito

Esercitazione per migliorare l'aspetto visivo della pagina web. Il compito prevede:

  • Aggiunta di un'ombra all'elemento div con il nome classe card. I valori specificati per l'ombra sono rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
  • Aggiunta di un'immagine di sfondo all'elemento div con il nome classe card. Il link dell'immagine fornito è: https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png.
  • Centratura dell'immagine di sfondo all'interno della card.
index.html

index.html

index.css

index.css

copy
  • Per aggiungere un'ombra a un elemento, utilizzare la proprietà box-shadow con il valore specificato. In questo caso, il valore è rgba(0, 0, 0, 0.3) 0px 19px 38px, rgba(0, 0, 0, 0.22) 0px 15px 12px.
  • Per impostare un'immagine come sfondo tramite la proprietà background-image, utilizzare la sintassi url("correct path"). All'interno delle parentesi, aprire le virgolette e specificare il percorso dell'immagine. In questo compito, il percorso corretto è fornito: url("https://codefinity-content-media.s3.eu-west-1.amazonaws.com/code-1/css-fundamentals/decorative-effects/challenge-background.png").
  • Per determinare la posizione dell'immagine di sfondo, utilizzare la proprietà background-position. In questo caso, impostare il valore della proprietà su center.
index.html

index.html

index.css

index.css

copy

1. Quale proprietà aggiunge un'ombra attorno al riquadro di un elemento?

2. Come si può aggiungere un'immagine come sfondo di un elemento?

question mark

Quale proprietà aggiunge un'ombra attorno al riquadro di un elemento?

Select the correct answer

question mark

Come si può aggiungere un'immagine come sfondo di un elemento?

Select the correct answer

Tutto è chiaro?

Come possiamo migliorarlo?

Grazie per i tuoi commenti!

Sezione 5. Capitolo 6
some-alt