1. Technology



SUMMARY Description:

The SUMMARY element provides a summary, caption, or legend for the HTML5 DETAILS element. Without the SUMMARY element, the DETAILS element will display as just a closed toggle (downward facing arrow) or nothing at all in browsers that support these elements.

The SUMMARY element is new in HTML 5.

DTD: HTML5: <!doctype html>

SUMMARY Web Browser Support:

HTML Versions

SUMMARY Attributes:



SUMMARY Contents:

A summary or label of the contents of the DETAILS element. This is what is displayed on the page when the DETAILS element is closed, so it should be clear enough to make people want to click on it.

Tags valid as content: Phrasing data—any phrase


Tags valid as container: DETAILS

SUMMARY Special Notes:

The SUMMARY element is only used to describe the contents of a DETAILS element. It is used as the label when the DETAILS element is closed and it can be clicked on to open the DETAILS element. Without the SUMMARY element element the DETAILS element will display as a small toggle arrow with the word “Details” beside it.

You should use the SUMMARY element when the word “Details” is not sufficiently descriptive enough to get people to click on it or if you are using a script to provide fallback information for the DETAILS element. Most pre-written scripts available for fallback options rely on the SUMMARY element to work.

SUMMARY Examples:

While the SUMMARY element is not widely supported yet, you can test it in this example page: DETAILS and SUMMARY Element Examples.

More SUMMARY Information:

©2014 About.com. All rights reserved.