CSS Immagine di sfondo


Esempio

La proprietà background-image viene utilizzata per specificare un'immagine di sfondo da applicare a tutti gli elementi corrispondenti. Per impostazione predefinita, questa immagine viene affiancata per coprire l'intero elemento, escluso il margine.

.myClass {
  background-image: url('/path/to/image.jpg');
}

Per utilizzare più immagini come background-image , definire l' url() separato da virgola url()

.myClass {
  background-image: url('/path/to/image.jpg'),
                    url('/path/to/image2.jpg');
}

Le immagini si impilano secondo il loro ordine con la prima immagine dichiarata in cima alle altre e così via.

Valore Risultato
url('/path/to/image.jpg') Specificare il / i percorso / i dell'immagine dell'immagine di sfondo o una risorsa immagine specificata con lo schema URI di dati (è possibile omettere gli apostrofi), separare i multipli con una virgola
none Nessuna immagine di sfondo
initial Valore predefinito
inherit Eredita il valore del genitore

Più CSS per l'immagine di sfondo

Questi attributi seguenti sono molto utili e quasi essenziali.

background-size:     xpx ypx | x% y%;
background-repeat:   no-repeat | repeat | repeat-x | repeat-y;
background-position: left offset (px/%) right offset (px/%) | center center | left top | right bottom;