Comment: HTML 5 is a new network standard, aiming to replace the existing HTML 4.01, XHTML 1.0 and DOM Level 2 HTML standards
It hopes to reduce the browser's need for plug-in-based rich internet application (RIA) that requires plug-in, such as Adobe Flash, Microsoft Silverlight, and Sun JavaFX.HTML 5 provides some new elements and attributes that reflect typical modern usage websites. Some of them are technically similar to the <div> and <span> tags, but have some meanings, such as <nav> (website navigation block) and <footer>. This tag will be conducive to search engine indexing, small screen devices and visually impaired people. It also provides new features for other browsing elements through a standard interface such as <audio> and <video> tags.
Some outdated HTML 4 tags will be cancelled, including those used purely as display effects, such as <font> and <center>, as they have been replaced by CSS. There are also some network behaviors (via) through DOM.
Let’s take a look at some of the new tag usage provided by HTML 5 and the difference from HTML 4.
The <article> tag defines the external content. For example, a new article from an external news provider, either from a blog, or from a forum. Or it comes from other external sources.
HTML5:<article></article>
HTML4:<div></div>
The <aside> tag defines content other than the article. The content of aside should be related to the content of the article.
HTML5: The content of <aside>Aside is independent content, but should be related to the content of the document. </aside>
HTML4:<div>Aside content is independent, but should be related to the content of the document. </div>
The <audio> tag defines sounds, such as music or other audio streams.
HTML5:<audio src=someaudio.wav> Your browser does not support the audio tag. </audio>
HTML4:<object type=application/ogg data=someaudio.wav><param name=src value=someaudio.wav></object>
The <canvas> tag defines graphics, such as charts and other images. This HTML element is designed for client vector graphics. It does not act on its own, but presents a drawing API to the client JavaScript to enable the script to draw everything you want to draw onto a canvas.
HTML5:<canvas id=myCanvas width=200 height=200></canvas>
HTML4:<object data=inc/hdr.svg type=image/svg+xml width=200 height=200></object>
The <command> tag defines command buttons, such as radio buttons, check boxes, or buttons.
HTML5: <command onclick=cut() label=cut>
HTML4: none
The <datalist> tag defines a list of optional data. Used with the input element to create a drop-down list of input values.
HTML5: <datalist></datalist>
HTML4: see combobox.
The <details> tag defines the details of the element that the user can view or hide by clicking. Use with <legend> to create the title of the detail. The title is visible to the user and detail can be turned on or off when clicked on it.
HTML5: <details></details>
HTML4: <dl style=display:hidden></dl>
The <embed> tag defines embedded content, such as plugins.
HTML5: <embed src=horse.wav />
HTML4: <object data=flash.swf type=application/x-shockwave-flash></object>
The <figcaption> tag defines the title of the figure element. The figcaption element should be placed at the position of the first or last child element of the figure element.
HTML5: <figure><figcaption>PRC</figcaption></figure>
HTML4: none
The <figure> tag is used to combine elements. Use the <figcaption> element to add a title to the element group.
HTML5: <figure><figcaption>PRC</figcaption><p>The People's Republic of China was born in 1949...</p></figure>
HTML4: <dl><h1>PRC</h1><p>The People's Republic of China was born in 1949...</p></dl>
The <footer> tag defines the footer of the section or document. Typically, it will contain the creator's name, the date of creation of the document, and/or contact information.
HTML5: <footer></footer>
HTML4: <div></div>
The <header> tag defines the header of the section or document.
HTML5: <header></header>
HTML4: <div></div>
The <hgroup> tag is used to combine the titles of a web page or section.
HTML5: <hgroup></hgroup>
HTML4: <div></div>
The <keygen> tag defines the generation key.
HTML5: <keygen>
HTML4: none
<mark> is mainly used to visually present the text that needs to be highlighted to the user. A typical application of the <mark> tag is to highlight search keywords to users in search results.
HTML5: <mark></mark>
HTML4: <span></span>
The <meter> tag defines the weights and measures. Use only for metrics with known maximum and minimum values. The scope of the metric must be defined, either in the text of the element or in the min/max attribute.
HTML5: <meter></meter>
HTML4: none
The <nav> tag defines the part of the navigation link.
HTML5: <nav></nav>
HTML4:<ul></ul>
The <output> tag defines different types of outputs, such as the output of a script.
HTML5: <output></output>
HTML4: <span></span>
<progress> tag running process. You can use the <progress> tag to display the process of time-consuming functions in JavaScript.
HTML5: <progress></progress>
HTML4: none
The <rp> tag is used in ruby comments to define what is displayed in browsers that do not support ruby elements.
HTML5: <ruby>Han<rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>
HTML4: none
<rt> Tags define the interpretation or pronunciation of characters (Chinese pronunciations or characters).
HTML5: <ruby>Han<rt> ㄏㄢˋ </rt></ruby>
HTML4: none
<ruby> Tag definition ruby comments (Chinese pronunciation or characters).
HTML5: <ruby>Han<rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>
HTML4: none
The <section> tag defines sections (sections, sections) in the document. For example, chapters, headers, footers, or other parts of the document.
HTML5: <section></section>
HTML4: <div></div>
The <source> tag defines a media resource for media elements such as <video> and <audio>.
HTML5: <source>
HTML4: <param>
The <summary> tag contains the title of the details element, which describes detailed information about a document or document fragment. The summary element should be the first child element of the details element.
HTML5: <details><summary>HTML 5</summary>This document teaches you everything you have to learn about HTML 5.</details>
HTML4: none
The <time> tag defines a date or time, or both.
HTML5: <time></time>
HTML4: <span></span>
The <video> tag defines a video, such as a movie clip or other video stream.
HTML5: <video src=movie.ogg controls=controls> Your browser does not support the video tag. </video>
HTML4:<object type=video/ogg data=movie.ogv><param name=src value=movie.ogv></object>