La propiedad z-index de CSS

 

 

 

La propiedad z index de css 1

Cómo trabajar con la propiedad `z-index` en CSS

En la publicación de posicionamiento mencioné que puedes usar la z-indexpropiedad para controlar el posicionamiento del eje Z de los elementos.

Es muy útil cuando tienes varios elementos que se superponen entre sí y necesitas decidir cuál es visible, más cerca del usuario, y cuál(es) deben quedar ocultos detrás de él.

Esta propiedad toma un número (sin decimales) y usa ese número para calcular qué elementos aparecen más cerca del usuario, en el eje Z.

Cuanto mayor sea el valor del índice z, más cerca estará el elemento del usuario.

 

Al decidir qué elemento debe ser visible y cuál debe ubicarse detrás de él, el navegador realiza un cálculo sobre el valor del índice z.

El valor predeterminado es auto, una palabra clave especial. Al utilizar auto, el orden del eje Z se determina según la posición del elemento HTML en la página: el último elemento del mismo nivel aparece primero, ya que se define al final.

De forma predeterminada, los elementos tienen el staticvalor de la positionpropiedad. En este caso, la z-indexpropiedad no tiene importancia: debe configurarse en absoluteo relativepara fixedque funcione. Fotos Porno y actrices porno

Ejemplo:

.my-first-div {position: absolute;top: 0;left: 0;width: 600px;height: 600px;z-index: 10;}.my-second-div {position: absolute;top: 0;left: 0;width: 500px;height: 500px;z-index: 20;}

.my-second-divSe mostrará el elemento con clase , y detrás de él .my-first-div.

Aquí usamos 10 y 20, pero puedes usar cualquier número. También números negativos. Es común elegir números no consecutivos, de modo que puedas ubicar los elementos en el medio. Si usas números consecutivos, deberás volver a calcular el índice z de cada elemento involucrado en el posicionamiento.

Tips de CSS




Tal vez te puede interesar:

  1. Filtros CSS
  2. Manejo de errores CSS
  3. Importar un archivo CSS usando @import
  4. La propiedad flotante CSS y su limpieza

La propiedad z-index de CSS

En la publicación de posicionamiento mencioné que puedes usar la z-indexpropiedad para controlar el posicionamiento del eje Z de los elementos. Cómo trabaja

programar

es

https://aprendeprogramando.es/static/images/programar-la-propiedad-z-index-de-css-2069-0.jpg

2024-10-15

 

La propiedad z index de css 1
La propiedad z index de css 1

Si crees que alguno de los contenidos (texto, imagenes o multimedia) en esta página infringe tus derechos relativos a propiedad intelectual, marcas registradas o cualquier otro de tus derechos, por favor ponte en contacto con nosotros en el mail [email protected] y retiraremos este contenido inmediatamente

 

 

Update cookies preferences