Etiqueta details
La etiqueta details crea un spoiler en HTML,
es decir, se utiliza para información que
se puede ocultar o mostrar según el deseo del usuario.
Por defecto, el contenido de la etiqueta está oculto. Para
mostrarlo a petición del usuario, se debe
añadir la etiqueta
summary, que especifica el título
para la etiqueta details. Este título siempre
es visible en la página (incluso si el contenido de details
está en estado plegado) y se puede hacer clic en él
para desplegar el texto oculto
o plegarlo.
También para mostrar el contenido oculto se puede
utilizar el atributo open de la etiqueta details
(por ejemplo, para mostrar el contenido de details
usando JavaScript).
Ejemplo
Veamos cómo funciona la etiqueta details:
<details>
<summary>click me</summary>
hidden text
</details>
:
Véase también
-
atributo
hidden,
que oculta bloques en la página