Learn more about the HTML Tag Content Model and the tag Model
Contents [1] metadata type [2] block type [3] header type [4] document flow type [5] statement type [6] embedded type [7] statement type before
The core of HTML is tag. Tags are used to describe the basic unit of the content in the document. Different tags indicate different meanings, and the nesting between tags indicates the structure between the content.
HTML tags extend the Content Model of HTML5 to seven categories, including metadata, block, title, document flow, statement, embedded, and plain. However, even these seven categories do not completely cover all the conditions of all elements. An element may not belong to any category and is called penetrating. Many elements may belong to more than one category, it is called hybrid.
For details about HTML tags, see the w3c link.
Classification [1] metadata (metadata)
Set the metadata element of the presentation, behavior, associated document, or other content
<Head> the element contains the element data of the document, including <base>, <command>, <link>, <meta>, <noscript>, <script>, <style>, and <title>.
For more information, see
[2] sectioning)
Defines the content range of a block, including <article>, <aside>, <nav>, and <section>.
For more information, see
[3] heading)
Elements defining the block content title, including
<H1> to
<H1>->
[Note] Microsoft's bing search engine points out that the page should not contain more than one h1 element.
[Default style]
margin: 0.67em 0 -> 0.83em 0 -> 1em 0 -> 1.33em 0 -> 1.67em 0 -> 2.33em 0;font-size: 2em -> 1.5em -> 1.17em -> 1em -> 0.83em -> 0.67em;font-weight: bold;
[Note]
<Hgroup>: Title group, used to combine titles. It is used only when the block requires multiple levels of titles.
<Hgroup>
[4] flow)
Elements in most documents <body>, only some metadata elements are not streaming, they are <base> and <title>
<P>: a text block composed of several sentences with similar themes (<p>-> paragraph)
[Default style]
margin: 16px 0;
<Hr>: the delimiter between different theme content.
[Default style]
margin: 8px 0;border-style: inset;border-width: 1px;
[Note]
<Pre>: pre-formatted text, usually indicating typographical content, such as code blocks and character paintings.
[Default style]
margin: 1em 0;white-space: pre;
<Blockquote>: References content from other sources. The cite attribute indicates the source url.
[Default style]
margin: 1em 40px;
[Note] the referenced signature must be referenced in the external definition.
<Blockquote cite = "http://baike.baidu.com/view/921793.htm"> <p> qianniu refers to Qifu, and the top of the bow is as a scorpion </p> </blockquote> <p> Lu Xun </p>
<Ol> <ul> <dl>
For more information about the list elements, see
<Table>
Suitable for data displayed in a data table, which must be marked by a table. For more information about table-class elements, see
<Form>
Form elements include text boxes, drop-down menus, check boxes, and other elements used to collect user input in the form. For more information, see
[5] phrasing)
Text in the document, text elements marked in paragraphs, etc.
<A> hyperlink anchor
The detailed information about the anchor point is now
In addition to <a>, the detailed information of this type of element is now
[6] embedded model (embedded)
Due to the limited expression ability of the elements provided by HTML, it is necessary for browser developers to embed content, introduce another resource element in the document or insert a document in another language. Embedded content includes nine categories: <audio>, <canvas>, <embed>, <iframe>, , <math>, <object>, <svg>, and <video>.
[Note] the default width and height of <embed>, <iframe>, and <object> elements in this class are 300px * 150px if they are not set.
(-> image)
The detailed information about the Image Tag is now
<Iframe>
The detailed information about the framework tag is now
<Canvas>
The detailed information about <canvas> is now
Audio and video
For more information about audio and video tags, click here.
[7] interactive)
Elements Used for user interaction, including <a>, <audio>, <button>, <details>, <embed>, <iframe>, , <input>, <keygen>, and <label>, <menu>, <object>, <select>, <textarea>, and <video>
Among them, the support of the four interactive elements: <details>, <summary>, <command>, and <menu> is not very good.
For more information, see <details> and <summary>.