Esempio
Impostare diverse proprietà dello sfondo in una dichiarazione:
body
{
background: #00ff00 url("smiley.gif") no-repeat fixed center;
}
Prova tu stesso " Definizione e utilizzo
Lo sfondo proprietà scorciatoia imposta tutte le proprietà di fondo in una dichiarazione.
Le proprietà che possono essere impostate, sono: background-color, background-image, background-position, background-size, background-repeat, background-origine, background-clip e background-attachment.
Non importa se uno dei valori dovesse risultare mancante, ad esempio, di sfondo: # ff0000 url(smiley.gif) ; È permesso.
| Valore di default: | see individual properties |
|---|---|
| Inherited: | no |
| animatable: | yes, see individual properties . Read about animatable Try it |
| Versione: | CSS1 + new properties in CSS3 |
| sintassi JavaScript: | object .style.background="red url(smiley.gif) top left no-repeat" Try it |
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| background | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
Note: Internet Explorer 8 e le versioni precedenti non supportano più immagini di sfondo su un elemento.
Nota: Vedere sostegno individuale del browser per ogni valore di seguito.
CSS Sintassi
background:bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;Nota: se una delle proprietà nella dichiarazione stenografia è la proprietà bg-size, è necessario utilizzare un / (slash) per separarla dalla proprietà bg-posizione, ad esempio, background:url(smiley.gif) 10px 20px / 50px 50px ; risulterà un'immagine di sfondo, posizionato a 10 pixel da sinistra, 20 pixel dall'alto, e la dimensione dell'immagine sarà largo 50 pixel e alto 50 pixel.
Nota: Se si utilizzano più sorgenti di background-image, ma vogliono anche un background-color, il parametro di background-color ha bisogno di essere l'ultimo della lista.
I valori delle proprietà
| Valore | Descrizione | CSS |
|---|---|---|
| background-color | Specifica il colore di sfondo da utilizzare | 1 |
| background-image | Specifica uno o più immagini di sfondo da utilizzare | 1 |
| background-position | Specifica la posizione delle immagini di sfondo | 1 |
| background-size | Specifica la dimensione delle immagini di sfondo | 3 |
| background-repeat | Specifica come ripetere le immagini di sfondo | 1 |
| background-origin | Specifica l'area posizionamento delle immagini di sfondo | 3 |
| background-clip | Specifica la zona di verniciatura delle immagini di sfondo | 3 |
| background-attachment | Specifica se le immagini di sfondo sono fissi o rotoli con il resto della pagina | 1 |
| iniziale | Consente di impostare questa proprietà al suo valore di default. Leggi iniziale | 3 |
| ereditare | Eredita questo immobile dal suo elemento genitore. Leggi su erediterà | 2 |
Pagine correlate
CSS tutorial: Sfondo CSS
CSS3 tutorial: CSS3 Backgrounds
Di riferimento HTML DOM: background property