<details>
<summary>Section 1 Title - Click to Expand</summary>
<p>This is the content for section 1. It is hidden by default and appears when the summary is clicked.</p>
</details>
<details>
<summary>Section 2 Title - Click to Expand</summary>
<p>This is the content for section 2. You can put any HTML content here, like text, images, or lists.</p>
</details>
Back to Snippets
HTML5 Details and Summary Accordion
Create a simple, accessible accordion (collapsible content section) using only semantic HTML5 <details> and <summary> tags. No JavaScript is needed for basic functionality.