La proprietà background CSS viene utilizzata per definire gli effetti di sfondo sull'elemento. Esistono 5 proprietà di sfondo CSS che influiscono sugli elementi HTML:

1. colore di sfondo
2. immagine di sfondo
3. ripetizione dello sfondo
4. allegato in background
5. posizione dello sfondo

1) Colore di sfondo CSS

La proprietà background-color viene utilizzata per specificare il colore di sfondo dell'elemento.

Puoi impostare il colore di sfondo in questo modo:

 h2,p{ background-color: #b0d4de; } <h2>My first CSS page.</h2> <p>Hello Javatpoint. This is an example of CSS background-color.</p> 

Produzione:

La mia prima pagina CSS.

Ciao Javatpoint. Questo è un esempio di colore di sfondo CSS.

2) Immagine di sfondo CSS

La proprietà background-image viene utilizzata per impostare un'immagine come sfondo di un elemento. Per impostazione predefinita l'immagine copre l'intero elemento. Puoi impostare l'immagine di sfondo per una pagina come questa.

 body { background-image: url('paper1.webp'); margin-left:100px; } 

4) Allegato CSS in background

La proprietà background-attachment viene utilizzata per specificare se l'immagine di sfondo è fissa o scorre con il resto della pagina nella finestra del browser. Se imposti fissa l'immagine di sfondo, l'immagine non si sposterà durante lo scorrimento nel browser. Facciamo un esempio con un'immagine di sfondo fissa.

 background: white url('bbb.webp'); background-repeat: no-repeat; background-attachment: fixed; 

5) Posizione dello sfondo CSS

La proprietà background-position viene utilizzata per definire la posizione iniziale dell'immagine di sfondo. Per impostazione predefinita, l'immagine di sfondo viene posizionata in alto a sinistra della pagina web.

È possibile impostare le seguenti posizioni:

1. centro
2. superiore
3. metter il fondo a
4. Sinistra
5. Giusto

 background: white url('good-morning.webp'); background-repeat: no-repeat; background-attachment: fixed; background-position: center;