The <summary>
tag defines a visible
heading for the <details>
element.
The heading can be clicked to view/hide the details.
Note:
The <summary> tag should be the first child element of the <details> element.
Example 1:
<details>
<summary>Epcot Center</summary>
<p>Epcot is a theme park at Walt Disney World Resort featuring exciting attractions,
international pavilions, award-winning fireworks and seasonal special events.
</p>
</details>
The above will give you...(click on the triangle)...
Epcot is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-winning fireworks and seasonal special events.
Example 2:
(for this one look at the code to see how it is done, though it is basically the same but with
additional <style> entries at the top of the form)
Epcot is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-winning fireworks and seasonal special events.