Detailed explanation of H5 tag usage

This time I will bring you a detailed explanation of the use of H5 tags. What are the precautions when using H5 tags? The following is a practical case, let’s take a look.

Do not allow writing of tags with closing tags: area (defines the area in the image map), base (specifies the default address or default target for all links on the page), br, col ( Define attribute values ​​for one or more columns in the table), embed (define embedded content, such as plug-in--5), hr, img, input, keygen, link, meta, param, source, track, wbr

You can omit the tags of the closing tag: li, dt, dd, p, rt, optgroup, option, colgroup, thread, tbody, tr, td, th

Tags that can be completely omitted: html, head, body, colgroup, tbody

New tags

section: A content block in the page, including a chapter, page, footer or other part of the page, can be used in conjunction with tags such as h1, h2... to represent the document structure.

article: Represents an independent piece of content on the page that has nothing to do with the context, such as an article.

aside: Define content other than article. The content of aside should be related to the content of article.

header: The title of the content block in the page or the entire page.

footer: The content block in the page or the footer of the entire page.

hgroup: Group the content blocks in the page or the titles of the entire page.

nav:NavigationPart of the link.

figure: Specifies independent flow content (images, charts, photos, code, etc., the content should be related to the main content, but if deleted, it should not have an impact on the document flow) .

video: video. exp:5425a82f44512c0d7058516172743e85videoa6a9c6d3f311dabb528ad355798dc27d

audio:Audio.

embed: Used to embed content (including various media).

mark: change color, pay attention.

progress:Progress bar. exp:b53711f9206adba438e27e16406001b4a211cb70e7878dbce34a6f8dc0175647

time: Defines the date or time, or both. This tag is used by the search engine. The engine will know based on this tag that this block represents a time. There is an attribute named pubdate. When the engine reads it, it will know that the value in datatime in this block is the publication time of this article, and there are two special characters T and Z in this time. T represents the separator of date and time, and Z represents the standard format of time. exp:59564c49d883b71c22279545d13f1f8191be1970faf1a1e6511e94af3a0f5b95

datalist: Define the option list. Use this element in conjunction with an input element to define the possible values ​​of the input. exp:9e8623ff3f31a5ea3c53568ddb9ccc8d1c6ebbe2b1c97f83cea4235f9f120ea7aba78b0dcb1db399ec615ce176d67bcebbb84e3e75b36eb4260cf6b3db844ca1

output:exp:<form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0<input type="range" id="a" value="50">100+<input type="number" id="b" value="50">=<output name="x" for="a b"></output></form>

Global properties

data-type: Custom properties.

hidden: hidden, single label.

spellcheck: Correct the grammar of the input content. exp:552ac683c0f554e98a10af6771e392eb40587128eee8df8f03d0b607fe983014

tabindex:tab key order.

contenteditable: Modify the content. exp:c4b10d018c0500c181c2aaa767b5fd1494b3e26ee717c64999d7867364b1b4a3

Make the entire text editable:

<script>window.
document
.designMode="off";</script>//off关闭,on:可编辑

I believe you have mastered the method after reading the case in this article, more Please pay attention to other related articles on the php Chinese website!

Recommended reading:

Detailed explanation of the use of paging query

How to develop WeChat wall with Node.js

The above is the detailed content of Detailed explanation of H5 tag usage. For more information, please follow other related articles on the PHP Chinese website!