2010-08-26 17 views
9

Tengo un div que utilizo para mostrar alertas cuando sea necesario.Pantalla CSS: ninguna y visibilidad: oculta

Si quiero cerrarlo después de un tiempo ¿puedo usar display? None o debería usar display: none y visibility: hidden?

Así que uno o ambos.

Gracias.

+0

display: none sólo funcionará bien – Tommy

Respuesta

18

Depende. Si necesita que el espacio se deje en blanco, es decir, el espacio no será ocupado por otros elementos debajo o alrededor de él, necesitará visibility: hidden. De lo contrario, use display: none, lo que permitirá que otros elementos se muevan al lugar del elemento.

No hay ninguna razón para usar ambos.

6

Visibilidad: oculto oculta el elemento pero aún ocupa espacio en el diseño. Pantalla: ninguna lo elimina por completo.

En su caso, utilizaría display: none

+1

la pantalla está apagada: oculto, no hay visibilidad: oculto :) – Sotiris

+0

Eso es lo que me pasa por escribir antes ¡café! Gracias por la captura, actualicé mi publicación. :) – Chuck

6

Si su contenido oculto tiene que ser accesible — a aquellos con los lectores de pantalla, por ejemplo —, entonces no debería usar display: none o visibility: hidden, ya que tanto puede ocultar potencialmente contenido de lectores de pantalla. En su lugar, debe usar un enfoque más accesible, como mover el contenido de la pantalla con un margen negativo. Consulte los siguientes enlaces para obtener más información:

456 Berea Street: Hiding with CSS: Problems and solutions
WebAIM Blog: Hiding content for screen readers

+1

Simplemente curioso, pero ¿por qué exactamente quieres ocultar el contenido pero aún así tenerlo accesible para los lectores de pantalla? Si está oculto, es porque actualmente no quiero que se muestre. – Maverick

+1

@ MrN00b Es posible que esté ocultando contenido por motivos estéticos, como secciones que se pueden colapsar y que el usuario puede ocultar o revelar. – Mike

Cuestiones relacionadas