Esempio
Lasciate che l'immagine di sfondo inizia dall'angolo in alto a sinistra del contenuto:
#example1
{
background:url(img_flwr.gif);
background-repeat: no-repeat;
padding:35px;
background-origin: content-box;
}
Prova tu stesso " Definizione e utilizzo
La proprietà background-origine specifica dove l'immagine di sfondo è posizionata.
Note: Se la proprietà background-attachment è impostata su "fixed" , questa proprietà non ha alcun effetto.
| Valore di default: | padding-box |
|---|---|
| Inherited: | no |
| animatable: | no. Read about animatable |
| Versione: | CSS3 |
| sintassi JavaScript: | object .style.backgroundOrigin="content-box" Try it |
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| background-origin | 4.0 | 9.0 | 4.0 | 3.0 | 10.5 |
CSS Sintassi
background-origin: padding-box|border-box|content-box|initial|inherit;I valori delle proprietà
| Valore | Descrizione | Gioca |
|---|---|---|
| padding-box | Valore di default. L'immagine di sfondo inizia dall'angolo in alto a sinistra del limite del cuscinetto | Gioca " |
| border-box | L'immagine di sfondo inizia dall'angolo in alto a sinistra del bordo | Gioca " |
| content-box | L'immagine di sfondo inizia dall'angolo in alto a sinistra del contenuto | Gioca " |
| initial | Consente di impostare questa proprietà al suo valore di default. Leggi iniziale | Gioca " |
| inherit | Eredita questo immobile dal suo elemento genitore. Leggi su erediterà |
Pagine correlate
CSS3 tutorial: CSS3 Backgrounds
Di riferimento HTML DOM: backgroundOrigin property