← All elements
<div class="ea"><details name="q" open><summary>One at a time</summary><p>Opening another panel closes this one.</p></details><details name="q"><summary>No script</summary><p>The browser handles it through the name attribute.</p></details><details name="q"><summary>Still accessible</summary><p>Native keyboard and screen reader support.</p></details></div>About this accordion
An accordion where opening one panel closes the others, using the shared name attribute on details elements. Open an example, copy the HTML and the CSS, and paste them into your page. There is nothing to install and no JavaScript to load.