"HTML5 Secret" reading notes (i)

First, the development process of HTML5

+ Several versions of HTML evolution: html2.0, html3.2, html4.0, html4.01, HTML5.

+ After the release of html4.01, Xtml1.0 was released, it is based on html4.01, no new elements and attributes are added, XHTML follows stricter syntax specification, XHTML defines new MIME type (content type) for application/ Xhtml+xml, but the xtml1.0 version of the page can still be published as a text/html type, xtml1.0 is an XML-style HTML, after xtml1.0 is xtml1.1,xtml1.1 version of the page can only be published through the Application/xhtml+xml type, it seems to be a genuine XML , followed by xtml2.0 is HTML5.

Second, the new characteristics of HTML5

+ Canvas for painting

+ video and audio for media playback

+ Better support for local offline storage-localstorage data persistent storage,sessionStorage关闭浏览器之后数据自动删除.

+ Added a number of semantic tags: header, footer, nav, aside, section, main, figure, template, data, time, etc.

(https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/HTML5/HTML5_element_list)

+ Improvements to Web Forms, new form features, such as new type types: color, datatime, email, number, etc.

(Https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/input#attr-type)

+ new technologies such as web workers (let browsers run JavaScript in the background), Web sockets (Web applications can get or push information in real time), geolocation (using geolocation), etc.

Third, the use of HTML5 new tags

+ HTML5 new Label Browser compatibility issue

IE9 The following IE browser does not support HTML5, you can dynamically add HTML5-specific tags through document.createelement:

Or use a mature framework directly:

<!--[if Lt IE 9]>        <script> src= "Http://html5shim.googlecode.com/svn/trunk/html5.js" </script>     <! [endif]-->

It is also possible that the user will disable the script, so it is best to add a noscript tag under the script tag above:

(See also: http://www.cnblogs.com/pigtail/archive/2013/01/07/2849136.html)

+ HTML4 The only way to create a document outline is to use the

In HTML5, each node can have its own

Iv. Types of documents

1, why HTML5 only write <! DOCTYPE html>?

+ HTML5 is not SGML-based (standard Universal Markup Language) and does not need to reference DTDs, so document declarations can be written directly <! DOCTYPE html>

+ html4.01 based on SGML, so <! The doctype> (document Declaration) must refer to the DTD,DTD rules that specify the markup language, and the browser can render the content correctly only if it is referenced

2, the role of DOCTYPE

+ Tell the browser what document type to use to parse the document

The difference between 3.html4.01 and HTML5

+ HTML4.01 has three document declarations (there are three types of document declarations with XHTML: strict, transitional, frameset), and HTML5 has only one.

HTML4.01 's three document declarations:

+ <! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01//en" "HTTP://WWW.W3.ORG/TR/HTML4/STRICT.DTD" >

+ <! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "HTTP://WWW.W3.ORG/TR/HTML4/LOOSE.DTD" >

+ <! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 frameset//en" "HTTP://WWW.W3.ORG/TR/HTML4/FRAMESET.DTD" >

v. Mode of the browser

1. The difference between standard mode and compatibility mode (weird mode):

+ Standard Mode Browser rendering page has a unified specification, compatibility mode in different browsers have their own set of rendering page specifications.

2, trigger the standard mode and compatibility mode method:

2.1 Browsers render pages in compatibility mode

+ document does not indicate DOCTYPE (no write doctype or DOCTYPE is not in the first line, DOCTYPE is not in the first line browser will think the page does not have DOCTYPE)

To be Continued

"HTML5 Secret" reading notes (i)