HTML5 standard learning-detailed explanation of document structure
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>
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):
A BOM tag, and this BOM tag must be U+FEFF.
0-n spaces or comments.
DOCTYPE statement.
0-n spaces or comments.
An HTML element.
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>
The difference between the two is obvious:
HTML5 changes DOCTYPE to a simpler
<!DOCTYPE html>
, 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:
<!DOCTYPE html>
- 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+htmlare 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.
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!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

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

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics





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

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.

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

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

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

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

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

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