Esempio
Come specificare un background-image fisso:
body
{
background-image: url('w3css.gif');
background-repeat: no-repeat;
background-attachment: fixed;
}
Prova tu stesso " Più "Try it Yourself" esempi di seguito.
Definizione e utilizzo
La proprietà background-attachment imposta se un'immagine di sfondo è fissa o scorre con il resto della pagina.
| Valore di default: | scroll |
|---|---|
| Inherited: | no |
| animatable: | no. Read about animatable |
| Versione: | CSS1 |
| sintassi JavaScript: | object .style.backgroundAttachment="fixed" Try it |
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente la proprietà.
| Proprietà | |||||
|---|---|---|---|---|---|
| background-attachment | 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.
CSS Sintassi
background-attachment: scroll|fixed|local|initial|inherit;I valori delle proprietà
| Valore | Descrizione |
|---|---|
| scroll | I rotoli di fondo insieme con l'elemento. Questa è l'impostazione predefinita |
| fixed | Lo sfondo è fissato per quanto riguarda la finestra |
| local | I rotoli di fondo insieme con il contenuto dell'elemento |
| 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
Come creare un semplice effetto di parallasse scorrimento (create an illusion of 3D depth) :
.fixed-bg {
/* The background image */
background-image: url("img_tree.gif");
/* Set a specified height, or the minimum height for the background image */
min-height: 500px;
/* Set background image to fixed
(don't scroll along with the page) */
background-attachment: fixed;
/* Center the background
image */
background-position: center;
/* Set the background image to no repeat */
background-repeat: no-repeat;
/* Scale the background
image to be as large as possible */
background-size:
cover;
}
Prova tu stesso " Pagine correlate
CSS tutorial: Sfondo CSS
Di riferimento HTML DOM: proprietà backgroundAttachment