HTML5 Standard Learning –doctype

Source: Internet
Author: User

Transferred from: http://www.cnblogs.com/GrayZhang/archive/2011/03/31/learning-html5-doctype.html

The previous article mainly describes the composition of the HTML document, while superficially touching the concept of "label omission", this article will conceptually introduce the first important element in the HTML document-DOCTYPE.

The so-called DOCTYPE, originally the concept of XML, that is, through a specific syntax, as a kind of metadata, to describe the elements allowed in the XML document, as well as the composition of the elements, nested rules and so on. Specific concepts can be used in a wiki to get a more detailed result.

But in HTML, DOCTYPE has some different effects, one of which is the famous feature that triggers the browser's standard mode. That is, if there is no DOCTYPE, the browser will enter a strange state called quirks mode, in which the browser's box model, style parsing, layout and so on are different from the standard provisions.

It should be noted that the so-called HTML standards, DOM standards, and so on, only specify the concept and behavior in the standard mode, as mentioned in the document composition, DOCTYPE is an HTML document absolutely cannot omit the part, so there is no "quirks mode" such concept. It is also because the standard does not make any rules on the quirks model, so different browsers in the quirks mode of processing is also different, the application of quirks mode is difficult.

HTML4 's DOCTYPE

In the HTML4 standard, DOCTYPE is classified as part of the HTML version information chapter. In this section, the standard specifies 3 types of doctype:

    • Strict mode: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> .
    • Transition mode: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> .
    • Frame mode: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> .

In the HTML4 standard, each DOCTYPE corresponding DTD file is specified with a valid URL and can be downloaded over the Internet. The browser can obtain the specific contents of the DTD based on the URL and parse the document according to the content.

The reality is different.

HTML4, like XML, is a fairly idealistic standard. However, the reality is often not so ideal, just imagine the following HTML document:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"                       "http://www.w3.org/TR/html4/frameset.dtd">

This document takes the doctype of a frame pattern, but its body does not use any <frame> elements, and it uses a standard HTML structure that should be specified by strict or transitional patterns. So what can the browser do in this case?

Refuse to render this page? No, the browser does not dare to do so, in the fierce competition in the market, if this causes some pages can not be rendered, you can only watch the market share into other fields. So the browser at most weak and weak to report a warning to protest, but still have to quietly parse out the document and render correctly.

This is the so-called "fault tolerance" of the browser, in fact, regardless of your doctype, the browser will be the maximum compatibility to parse a document, and with the greatest effort to make this document displayed in line with the developer's expectations. And this feature of the browser has gradually made the standard-makers realize that DOCTYPE seems really unimportant. So, in HTML5, there was a major change in doctype ...

HTML5 's DOCTYPE

By the HTML5, this change is believed to have been known by most people that HTML5 has simplified the DOCTYPE statement, just need it <!DOCTYPE html> .

Just as mentioned earlier, in the HTML4 era, standard-makers have realized that doctype to browser rendering is not much help, in addition to the boring Web validator to see, DOCTYPE seems to only trigger browser compatibility mode role. As a result, the standard working Group took a very practical attitude and tested the simplest doctype of all courses to trigger the standard model, which was finally reached.

But the story will not be so simple, the standard working Group is not to complete the simple action of the rogue molecules, in fact, they still very diligence to consider the backward compatibility, extensibility, and so on a series of things, and finally doctype a chapter with a lot of text to describe, get a very detailed results.

In the relevant section of the HTML5 Reference manual, the DOCTYPE is divided into 3 categories:

General Doctype-normal DOCTYPE

Ordinary doctype is the simplest form we see, that <!DOCTYPE html> is, his real composition is this:

  1. A paragraph of text, that is <!DOCTYPE , case insensitive.
  2. 1 or more spaces, please refer to the explanations in the introduction for a definition of spaces.
  3. Characters HTML , which are equally case-insensitive.
  4. 1 or more spaces.
  5. End tag, that is > .
No longer recommended for doctype-deprecated DOCTYPE

The so-called HTML4 era of several DOCTYPE, its composition is as follows:

    1. A paragraph of text, that is <!DOCTYPE , case insensitive.
    2. 1 or more spaces.
    3. Characters HTML , which are equally case-insensitive.
    4. 1 or more spaces.
    5. Characters PUBLIC are not sensitive to case.
    6. Continue with one or more spaces.
    7. A pair of quotation marks or single quotation marks (must match before and after), with a public ID in the quotation marks.
    8. Optional content:
      1. 1 or more spaces.
      2. A pair of quotation marks or single quotation marks (which must match before and after), with a system ID corresponding to the previous public ID in the quotation marks.
    9. 1 or more spaces.
    10. End tag, that is > .

In the standard, the public ID and the system ID have strict correspondence, and if the specified system ID cannot have a public ID, then the 8th optional content above will not exist. HTML5 completely abandoned the transition and frame-type DOCTYPE in HTML4 and integrated the DOCTYPE declaration of XHTML, resulting in 6 combinations of the following:

    • <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN">
    • <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
    • <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
    • <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    • <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Legacy Tools Doctype-leagacy Tool compatible DOCTYPE

As the name implies, is completely to be compatible with the historical heritage of the ancient times prepared doctype, and even have no way to verify what kind of "tools" will make this doctype ... The Legacy tool-type DOCTYPE consists of the following:

  1. A paragraph of text, that is <!DOCTYPE , case insensitive.
  2. 1 or more spaces.
  3. Characters HTML , which are equally case-insensitive.
  4. 1 or more spaces.
  5. Characters SYSTEM are not sensitive to case.
  6. Continue with one or more spaces.
  7. A pair of quotation marks or single quotation marks (must match before and after), enclose a paragraph of text in quotation marks about:legacy-compat , note that the text is case sensitive .
  8. 1 or more spaces.
  9. End tag, that is > .

For example, such DOCTYPE belong to this category: <!doctype HTML system "about:legacy-compat"> , basically except the case, nothing worth changing.

The details of the reality

For the role of DOCTYPE, in the real browsing, only play the role of triggering the standard mode of the browser. Although according to the standard, in an HTML document, DOCTYPE can have other elements, such as a u+ffef BOM, a few comments, a little space, but in the current state, and not so ideal:

    • For ie6-9, if there is a comment before doctype, it goes into quirks mode.
    • For IE6, if an XML declaration exists before DOCTYPE, it goes into quirks mode.

After writing to find out, the problem is all out under IE ... Questions about DOCTYPE the next chapter focuses on the issue of coding declarations.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.