HTML5 New Elements

By | January 26, 2020

HTML5 is the new version of HTML in which many new elements have come, about which we will get into it. By using these new elements, you can make your web page more attractive and dynamic.

New Elements of HTML5:-

Some of the new elements of HTML5 are as follows

<header> It reflects the head of the page.
<footer> This reflects the footer of our web page.
<bdi> It separates the part of the part which is formatted in other disk outside.
<article> This reflects the article in the web page.
<aside> It reflects aside part of the content present in the webpage.
<details> It provides extras according to the demand of the uses.
<dialog> This displays the dialog box in the web page.
<figcaption> It captures caption for <figure> element.
<figure> This tag reflects self-contained.
<main> It reflects the main content present in the HTML Document.
<mark> Refers to the content that needs to be highlighted in our web page.
<meter> Refers to the scalar value within a known range.
<nav> It describes the part of the navigation link.
<progress> Progress bar is defined for the task whose progress is to be displayed.
<rp> What to show in browsers that do not support ruby annotations.
<ruby> This tag reflects ruby annotations.
<rt> Ruby reflects the accent and explanation of the characters.
<section>HTML reflects a section in the document.
<summary> This captures the visible title for Element <details>.
<time> It reflects time.
<wbr> It reflects line breaks.

Media Elements:-

TagDescription
<picture> Serves container for multiple pictures.
<embed> It displays containers for deaf files.
<audio> It reflects the sound content.
<source> This element reflects many media resources for media elements.
<track> This element translates text tracks for media elements.
<video> This element reflects the video content.

HTML5 Graphics Tags:-

<canvas> This allows drawing graphics via element script.
<svg> This element is used to pull scalable vector graphics.

HTML5 New Form Elements:-

<output> This reflects the result of the entire calculation.
<datalist> It prepares the predefined index for the input element.

HTML5 New Input types:-

New Input TypesNew Input Attributes
emailform
colorlist
dateautocomplete
datetimeautofocus
datetime-localformaction
monthformenctype
numberformmethod
rangeformnovalidate
searchformtarget
telheight and width
timemin and max
weekmultiple
urlpattern
placeholder
required
step
Spread the love

Leave a Reply

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