Home Web Front-end H5 Tutorial HTML5 standard learning-detailed explanation of document structure

HTML5 standard learning-detailed explanation of document structure

Mar 27, 2017 pm 03:34 PM

Speaking of the structure of HTML, many people can explain it clearly. Generally speaking, the answer may be like this:

A DOCTYPE, an html, which contains head and body elements.

Of course this cannot be said to be incorrect, but if you ask what a minimum HTML source file must contain, I am afraid that few people can answer it correctly.

Let’s answer this question first. The content required for a simplest HTML5 source code file is as follows:

<!DOCTYPE html>
Copy after login

Yes, that’s it, one character is not much, one There are a lot of characters. Except for the case, which can be changed at will, no other content can be changed.

So what are the rules that cause a simplest source code file to have a doctype statement? According to the standard, an HTML document consists of the following content (strictly in order):

  1. A BOM tag, and this BOM tag must be U+FEFF.

  2. 0-n spaces or comments.

  3. DOCTYPE statement.

  4. 0-n spaces or comments.

  5. An HTML element.

  6. 0-n spaces or comments.

There are some differences from HTML4 here. The simplest source code file of an HTML4 is like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                      "http://www.w3.org/TR/html4/loose.dtd">
<title>这里是标题</title>
Copy after login

The difference between the two is obvious:

  • HTML5 changes DOCTYPE to a simpler &lt;!DOCTYPE html&gt;, which is already well known.

  • There is an additional <title> tag in HTML4.

The key point here is the <title> tag. Regarding this tag, the HTML4.01 standard says this:

Every HTML document must have a TITLE element in the HEAD section.

That is to say, HTML4 requires that the <title> tag must exist.

In the HTML5 standard, it says this:

There must be no more than one title element per document.

HTML5 only sets an upper limit on the number of <title> tags, but does not specify a lower limit. In other words, a document without <title> is considered a legal document. .

For DOCTYPE, there are 6 types of DOCTYPE set in HTML4, and DOCTYPE is divided into 3 types in HTML5. This will be explained in detail in subsequent chapters.

Let’s go back and look at the document composition. Apart from elements that don’t make much sense, the composed list also indicates that there is an HTML element, but there is no such thing in the simplest source code. This is because in the HTML specification, there has always been the concept of "implicit tags". Regarding implicit tags, it can be roughly explained as follows:

Some elements, when certain prerequisites are met, Its start tag or end tag can be omitted in the source code. In this case, the omitted tag is called an "implicit tag".

It should be noted that the omission here refers to the omission of in the source code, but in the final DOM tree, this tag exists, so it is called Implicit tag for . Therefore, the simplest source code structure above, after generating the DOM tree, its real structure is like this:

&lt;!DOCTYPE html&gt;

    
    
Copy after login
Finally, let’s summarize some of the specifications in XHTML:

  • Because it is

    XML, so in order to indicate that this is an HTML document, there must be a namespace whose value is www.w3.org/1999/xhtml.

  • Because it is XML, the MIME type cannot be

    text/html, text/xml, application/xml, application/xml+html are better choices.

  • Because it is XML, there must be a root element. The root element is

    , which is the beginning and end of The label cannot be omitted.

  • Because it is XML, as long as all elements have a start tag, they must not have an end tag or be self-closing.

  • Because it is XML, all elements must be strictly case-sensitive, and element names must be lowercase.

Because it is XML, the document has become much stricter, and because it is XML, its readability and standardization have improved a lot. But in the end, we always have to find the best balance between the tolerance of HTML and the standardization of XML. Blindly pursuing extremes is always a mistake.


The above is the detailed content of HTML5 standard learning-detailed explanation of document structure. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Table Border in HTML Table Border in HTML Sep 04, 2024 pm 04:49 PM

Guide to Table Border in HTML. Here we discuss multiple ways for defining table-border with examples of the Table Border in HTML.

Nested Table in HTML Nested Table in HTML Sep 04, 2024 pm 04:49 PM

This is a guide to Nested Table in HTML. Here we discuss how to create a table within the table along with the respective examples.

HTML margin-left HTML margin-left Sep 04, 2024 pm 04:48 PM

Guide to HTML margin-left. Here we discuss a brief overview on HTML margin-left and its Examples along with its Code Implementation.

HTML Table Layout HTML Table Layout Sep 04, 2024 pm 04:54 PM

Guide to HTML Table Layout. Here we discuss the Values of HTML Table Layout along with the examples and outputs n detail.

HTML Input Placeholder HTML Input Placeholder Sep 04, 2024 pm 04:54 PM

Guide to HTML Input Placeholder. Here we discuss the Examples of HTML Input Placeholder along with the codes and outputs.

Moving Text in HTML Moving Text in HTML Sep 04, 2024 pm 04:45 PM

Guide to Moving Text in HTML. Here we discuss an introduction, how marquee tag work with syntax and examples to implement.

HTML Ordered List HTML Ordered List Sep 04, 2024 pm 04:43 PM

Guide to the HTML Ordered List. Here we also discuss introduction of HTML Ordered list and types along with their example respectively

HTML onclick Button HTML onclick Button Sep 04, 2024 pm 04:49 PM

Guide to HTML onclick Button. Here we discuss their introduction, working, examples and onclick Event in various events respectively.

See all articles