Esempio
Set background-image per il un <body> elemento:
body
{
background-image: url("paper.gif");
background-color: #cccccc;
}
Prova tu stesso " Più "Try it Yourself" esempi di seguito.
Definizione e utilizzo
La proprietà background-image imposta una o più immagini di sfondo di un elemento.
Lo sfondo di un elemento è la dimensione totale dell'elemento, tra cui imbottitura e di confine (but not the margin) .
Per impostazione predefinita, uno sfondo-immagine viene posizionata nell'angolo in alto a sinistra di un elemento, e ripete sia verticalmente che orizzontalmente.
Tip: Impostare sempre un colore di sfondo da utilizzare se l'immagine non è disponibile.
| Valore di default: | none |
|---|---|
| Inherited: | no |
| animatable: | no. Read about animatable |
| Versione: | CSS1 + new values in CSS3 |
| sintassi JavaScript: | object .style.backgroundImage="url(smiley.gif)" Try it |
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| background-image | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Note: IE8 e precedenti non supportano più immagini di sfondo su un elemento.
CSS Sintassi
background-image:url|none|initial|inherit;I valori delle proprietà
| Valore | Descrizione |
|---|---|
| url(' URL ') | L'URL per l'immagine. Per specificare più di un'immagine, separare gli URL con una virgola |
| none | verrà visualizzata alcuna immagine di sfondo. Questa è l'impostazione predefinita |
| initial | Consente di impostare questa proprietà al suo valore di default. Leggi iniziale |
| inherit | Eredita questo immobile dal suo elemento genitore. Leggi su erediterà |
Altri esempi
Esempio
Impostare più immagini di sfondo per il <body> elemento:
body {
background-image: url("img_tree.gif"),
url("img_flwr.gif");
background-color: #cccccc;
}
Prova tu stesso " Pagine correlate
CSS tutorial: Sfondo CSS
CSS3 tutorial: CSS3 Backgrounds
Di riferimento HTML DOM: backgroundImage property