Regolazione della sovrapposizione degli elementi lungo l'asse Z in CSS

L'ordine di sovrapposizione degli elementi può essere regolato utilizzando la proprietà z-index, che accetta come valori numeri interi positivi o negativi, oppure zero. La proprietà funziona solo per gli elementi in cui il valore position è impostato come absolute, fixed o relative.

Quando si utilizza questa proprietà, la regola di sovrapposizione degli elementi è la seguente: sarà più in alto quell'elemento che ha un valore z-index maggiore.

Cambiamo l'ordine di sovrapposizione degli elementi dell'esempio precedente. Per fare ciò, impostiamo per il primo elemento un z-index maggiore rispetto al secondo, ad esempio in questo modo:

css#elem1 {
  z-index: 2;
}
#elem2 {
  z-index: 1;
}

Risultato dell'esecuzione del codice: