Tag details

Tag details vytváří spoiler v HTML, to znamená, že se používá pro informace, které lze skrýt nebo zobrazit dle přání uživatele.

Ve výchozím nastavení je obsah tagu skrytý. Pro jeho zobrazení na požádání uživatele je třeba přidat tag summary, který určuje nadpis pro tag details. Tento nadpis je vždy viditelný na stránce (i když je obsah details v sbaleném stavu) a lze na něj kliknout pro rozbalení skrytého textu nebo sbalení.

Pro zobrazení skrytého obsahu lze také použít atribut open tagu details (například pro zobrazení obsahu details pomocí JavaScriptu).

Příklad

Podívejme se, jak tag details funguje:

html<details>
  <summary>click me</summary>
  hidden text
</details>

Результат:

Viz také

  • atribut hidden,
    který skrývá bloky na stránce