Es una propiedad que es capaz de ajustarse a los elementos en cuanto a su profundidad, es decir podemos ajustar
cual elemento se ubica por encima del otro, o detras del otro
Mientras mas altos los valores del z-index el objeto se mostrara mas por enzima
Mientras mas bajos los valores del z-index el objeto se mostrara mas por debajo de los demas
Si dos objetos tienen el mismo z-index, entonces seguiran el orden natural del documento, es decir
el ultimo elemento en el HTML estara encima de los anteriores
sigue el flujo del HTML siendo el ultimo en el HTML el que se
ubica mas al frente
la explicacion de esta caja anterior es la siguiente:
La caja azul tiene el index menor (1), por ello se encuentra mas al fondo
La caja roja se ubica mas al frente, ya que tiene el z-index mas alto (3)
La caja tres (verde) y la caja cuatro (purpura), tienen el mismo z-index, sin embargo se ve mas al frente la purpura
ya que como aparece anterio
La unica forma de poner al hijo debajo del
elemento padre es con el uso de z-index negativos como: " -1 "