Tag details
A tag details cria um spoiler em HTML,
ou seja, é usada para informações que
podem ser ocultadas ou exibidas conforme a vontade do usuário.
Por padrão, o conteúdo da tag está oculto. Para
exibi-lo a pedido do usuário, deve-se
adicionar a tag
summary, que especifica um título
para a tag details. Este título está sempre
visível na página (mesmo que o conteúdo do details
esteja no estado recolhido) e pode-se
clicar nele para expandir o texto
oculto ou para recolhê-lo.
Também é possível usar o atributo open da tag details
para exibir o conteúdo oculto
(por exemplo, para mostrar o conteúdo do details
usando JavaScript).
Exemplo
Vamos ver como a tag details funciona:
<details>
<summary>click me</summary>
hidden text
</details>
:
Veja também
-
atributo
hidden,
que oculta blocos na página
