HTML5 new features introduction – part2

 HTML5 new features introduction – part2

In  last article we looked HTML5 new features introduction, In this and coming  articles we will explore HTML5 new articles in more detail.

If you are already familiar with Web development then you may have worked on “Accordian”. Accordian are the panels that are used to display collapse able content when we have limited space on web page. See the example here.

In HTML5 there are some new elements introduced. these are

<detail> and <summary> elements

details summary elements in HTML5

image from edx.

Syntax:

<details> element will generate a widget to show or hide the contents of element,  by clicking on its child <summary> element. Following is the full code.

 

We can use detail / summary element inside another detail /summary element.

Support for this element  till Feb 2015 in different browsers is as shown in the figure.

detail - summary element support in HTML5

Latest and up to date version can be found at http://caniuse.com/#feat=details

In next article we would look into more HTML5 elements and attributes.

 

No Responses