Proprietà CSS z-index
Esempio
Imposta lo z-index per un'immagine:
img
{
position: absolute;
left: 0px;
top: 0px;
z-index: -1;
}
Definizione e utilizzo
La z-index
proprietà specifica l'ordine di stack di un elemento.
Un elemento con un ordine di stack maggiore è sempre davanti a un elemento con un ordine di stack inferiore.
Nota: z-index
funziona solo su elementi posizionati (posizione: assoluta, posizione: relativa, posizione: fissa o posizione: appiccicosa) e elementi flessibili (elementi che sono figli diretti di
display: elementi flessibili).
Nota: se due elementi posizionati si sovrappongono senza uno z-index
specificato, l'elemento posizionato per ultimo nel codice HTML verrà mostrato in alto.
Valore di default: | auto |
---|---|
Ereditato: | no |
Animabile: | sì. Leggi su animabile |
Versione: | CSS2 |
sintassi JavaScript: | oggetto .style.zIndex="-1" |
Supporto browser
I numeri nella tabella specificano la prima versione del browser che supporta completamente la proprietà.
Property | |||||
---|---|---|---|---|---|
z-index | 1.0 | 4.0 | 3.0 | 1.0 | 4.0 |
Sintassi CSS
z-index: auto|number|initial|inherit;
Valori di proprietà
Value | Description | Play it |
---|---|---|
auto | Sets the stack order equal to its parents. This is default | |
number | Sets the stack order of the element. Negative numbers are allowed | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Pagine correlate
Tutorial CSS: Posizionamento CSS
Riferimento HTML DOM:
proprietà zIndex