Details, dialog and interactive elements

Details, dialog and interactive elements

details and summary create a disclosure widget without JavaScript. The dialog element can represent modal or non-modal dialogs; manage focus, provide an accessible title and ensure users can close it. Test behavior in supported browsers.

Try it yourself

Change the example, run it, and explain the result in your own words. Then create one variation of your own.

Key idea

Use the example as a starting point, not something to memorize. Practise, inspect the result and make small improvements.