notas CSS de combate (ocho) de ocultación de elementos

En CSS, un elemento oculto hay muchas maneras, vamos a introducir una por una

1, establecer la opacidad

opacity: 0;

La opacidad del elemento se establece en 0, pero este elemento todavía va a ocupar sus posiciones originales, pero no es visible en lo visual

No cambia el diseño de la página, también puede responder a las acciones del usuario

2, establecer la visibilidad

visibility: hidden;

La visibilidad del elemento se establece en ocultar, por lo que este elemento no es visible, pero aún ocupa su posición original

No cambia el diseño de la página, pero no puede responder a las acciones del usuario

Además, los descendientes de este elemento serán puestos a ocultar, pero se puede dar a los elementos descendientes establecer explícitamente la visibilidad Para mostrar visibles

3, un modo de visualización

display: none;

Este es un elemento oculto en el verdadero sentido, no ocupa el espacio original, como si este elemento no debe existir como

Esto significa que se ha cambiado el diseño de la página, como es natural, no puede responder a las acciones del usuario

Además, los descendientes de este elemento serán puestos a ocultar

4, un modo de posicionamiento

position: absolute;
top: -999px;
left: -999px;

Fije los elementos de los métodos de orientación a la posición absoluta, por lo que puede hacer que un elemento del flujo del documento

A continuación, establezca la izquierda y la parte superior de un número negativo grande, el elemento de fuera de la región visible, ocultando elementos de implementación


Por último agregar una propiedad, desbordamiento, cuando el contenido excede el predeterminado para el bloque elemento de cómo procesar valores opcionales como sigue:

  • visible: Más allá del contenido se mostrará fuera de los elementos de la caja
  • hidden: Más allá del contenido se recortará
  • scroll: Mostrar siempre la barra de desplazamiento, se puede tirar el contenido de la barra de desplazamiento para ver más allá
  • auto: Cuando el contenido no supere los elementos caja, no se muestran barras de desplazamiento cuando el contenido excede la caja del elemento, a las barras de desplazamiento de la pantalla

[Leer más series CSS, consulte las notas de estudio CSS ]

Supongo que te gusta

Origin www.cnblogs.com/wsmrzx/p/12497575.html
Recomendado
Clasificación