HTML 5 Elements

elements in html 5

In HTML5, there are lots of new elements are added which provides some extra functionality to create an attractive and dynamic website. With the help of these HTML 5 Elements, you can make your code easy and quick.

HTML-5 New Tags:

Following is the complete list of the newly added element with their descriptions.

Structural or Semantic Tags:

<article>: It defines the independent or self-contained content of a webpage.

<aside>: It defines the content which provide information about the main content.

<bdi>: It is used to isolate the part of text which might be formatted in another direction.

<details>: It defines additional information which only visible as per user demand.

<dialog>: It represents a dialog box or other interactive components.

<figcaption>: It defines caption for the <figure> element.

<figure>: It defines a self-contained content, and referenced as a single unit.

<footer>: It represents the footer section of the webpage.

<header>: It defines the introductory or navigational content of the webpage.

<main>: It specifies the main content of the HTML document.

<mark>: It represent the text which is highlighted or marked for reference or notation purposes.

<meter>: It represents a scalar value within a known range.

<nav>: It represents the section which contains navigation links.

<progress>: It defines a progress bar which shows completions progress of a task.

<rp>: It defines alternative content for the browser which do not support ruby annotations.

<rt>: It defines explanations and pronunciations of characters in ruby annotations.

<ruby>: It defines ruby annotations (Specifically for Asian language).

<section>: It defines a generic section within an HTML document.

<summary>: It defines summary or caption for a <details> element which can be clicked to change the state of <details> element.

<time>: It defines data/time within an HTML document.

<wbr>: It specifies a line break opportunity.


HTML5 Form Tags:

<datalist>: It represent predefined list for input <option> element.

<output>: It is used a container element to represent the output of a calculation or outcome of user action.


Graphics Tags:

<canvas>: It allows drawing graphics and animations via scripting.

<svg>: It is used to draw scalable vector graphics.


HTML5 Media Tags:

<audio>: It defines sound content.

<embed>: It defines a container for external files/application/media.

<source>: It defines multiple media resources for the media elements.

<track>: It defines text tracks for <audio> and <video> files

<video>: It defines video content within HTML document.


HTML5 New <input> types:

color: It represents an input field which defines a color selector.

date: It represents an input field to define a date selector.

datetime: It defines full date and time display with time zone information.

datetime-local: It defines date and time without time zone information.

email: It defines an input field with email pattern Validation.

month: It defines the input field to enter month for the particular year

number: It defines field which selects a numeric value only.

range: It defines a numeric value selector with a given range of 1 to 100.

search: It is used to define a search field.

tel: It represents a control to enter a telephone number.

time: It represents a control to enter time value with no time zone.

url: It represents an input field to enter a URL

week: It defines a selector for week value for the particular year.


Recommended Posts:

Spread the love

Leave a Comment

Your email address will not be published. Required fields are marked *