Cómo ocultar una etiqueta DIV

Escrito por robert allen | Traducido por beatriz sánchez
  • Comparte
  • Twittea
  • Comparte
  • Pin
  • E-mail
Cómo ocultar una etiqueta DIV
Al igual que otros elementos HTML, las etiquetas DIV pueden tener estilos en CSS. (Comstock/Comstock/Getty Images)

En HTML, las etiquetas "<div>" se usan para separar bloques de texto, dándoles estilos únicos o colocándolas cuidadosamente en un sitio web. Puesto que cada etiqueta DIV puede tener su propio ID, o una clase que comparte con otros elementos de la página web, puedes ocultarla usando "CSS", una especificación versátil que te permite hacer todo tipo de cambios en los elementos de una página web.

Nivel de dificultad:
Fácil

Otras personas están leyendo

Instrucciones

    Ocultar una única etiqueta DIV

  1. 1

    Abre tu código fuente de página web en un editor HTML o con el Bloc de Notas. Necesitarás editar el HTML real, así que un editor "what-you-see-is-what-you-get (lo que ves es lo que obtienes)" o WYSIWYG, no es suficiente.

  2. 2

    Desplázate por el código de la página web hasta la etiqueta DIV que quieres ocultar, la etiqueta empezará con "<div>" y terminará con "</div>". El resto de cambios que debes hacer están en la etiqueta de apertura.

  3. 3

    Añade la siguiente línea de código (conservando las comillas) entre "<div" y ">":

    style="display:none;"

    Si no hay otros atributos (como "id=" o "class=") en el <div>, debería decir "<div style="display:none;">" y estar seguido de los contenidos de texto de la etiqueta.

  4. 4

    Guarda y cierra el archivo HTML. Cuando la página sea visitada usando un navegador web, la etiqueta DIV estará oculta.

    Ocultar múltiples DIVs

  1. 1

    Abre el archivo de código fuente del sitio web, que seguramente terminará con ".html". Usa un editor de texto sencillo, como el Bloc de Notas en Windows, TextEdit en OSX, o nano en Linux.

  2. 2

    Busca la sección de la cabecera del documento, que empieza por "<head>" y termina con "</head>". Inmediatamente después de la etiqueta "<head>", añade el siguiente código copiándolo y pegándolo directamente en el HTML de tu página web: <style type="text/css"> .hide { display:none; } </style>

  3. 3

    Añade la línea "class='hide'" entre "<div" y ">" en cada etiqueta DIV que quieres ocultar. Si no hay otros atributos en la etiqueta, cada etiqueta de apertura dirá ahora simplemente "<div class='hide'>", esto hace referencia a la clase CSS "hide" definida en la cabecera de página.

  4. 4

    Guarda el documento y cierra el editor HTML. Cuando abras la página en un navegador web, cada etiqueta DIV con "class='hide'" en sus atributos estará oculta para el visitante.

No dejes de ver

Filtrar por:
  • Mostrar todos
  • Artículos
  • Galerías de fotos
  • Videos
Ordenar:
  • Más relevante
  • Más popular
  • Más reciente

No se encuentran artículos disponibles

No se encuentran slideshows disponibles

No se encuentran videos disponibles