HTML Tutorial

HTML-tagg: <details>

Användning av <details>:

  • Används för att skapa interaktiva sektioner som kan expandera eller döljas.
  • Perfekt för att visa eller dölja ytterligare information, såsom definitioner, beskrivningar eller utdrag.

Attribut för <details>:

  • open: Om värdet är "true" expanderas detaljen som standard.

Exempel med <details>:

<!-- Definition av "HTML" -->
<details>
  <summary>Vad är HTML?</summary>
  <p>HTML står för HyperText Markup Language.</p>
</details>

<!-- Utdrag från "Moby Dick" -->
<details>
  <summary>Utdrag från "Moby Dick"</summary>
  <p>Kalla mig Ismael...</p>
</details>

Exempel i praktiken: Utforska <details>-taggen

<!DOCTYPE html>
<html>
<head>
  <title>Utforska `<details>`-taggen</title>
</head>
<body>

<h1>Om `<details>`</h1>

<details open>
  <summary>Vad är `<details>`?</summary>
  <p>En tagg som skapar interaktiva sektioner som kan expandera eller döljas.</p>
</details>

<details>
  <summary>Hur använder man `<details>`?</summary>
  <p>Använd den för att visa eller dölja ytterligare information.</p>
</details>

</body>
</html>