Details
1 minute read
A details block hides a passage behind a summary line. It is the native <details> element, so it opens and closes without JavaScript, and the browser can open it when the reader follows an anchor inside it.
Syntax
:::details{summary="Install on Windows" open}
Run the installer, then restart the terminal.
:::
Options
| Name | Type | Default | What it does |
|---|---|---|---|
summary |
string | Details |
The text of the disclosure control. |
open |
bare word | closed | Its presence starts the block expanded. |
Example
Show the full command
npx mizzen build site --out distThis one starts open
The open word is all it takes. Leave it out for a block that starts closed.
Notes
- The body is Markdown, including lists, code, and links.
- Use details for optional depth, not for information every reader needs. A page read without JavaScript still shows the summary and opens on a click.
- Never put one details block inside another merely to save space; nested disclosures are hard to scan.