What are the tags and common rules in HTML5? Introduction to html5 tags and rules

This article introduces to you what are the tags and common rules in HTML5? The introduction of html5 tags and rules has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

1. Naming rules
[Mandatory]class: The word must be all lowercase, separated by -, and must represent the content or function of the corresponding module or component. It must not be named with the built-in HTML style , naming should have clear semantics.
[Mandatory]id: must remain unique in the page, and the naming should have clear semantics.

2. Tag
[Mandatory]The tag name in Html must use lowercase letters.
[Mandatory] The closing of the tag must comply with the regulations of HTML5.
[Mandatory] The use of tags must comply with the nesting rules of tags. For example: p must not be placed in p, and tbody must be placed in table.
[Recommendation] The use of tags must follow the semantics of the tags, for example:
p - paragraph
h1, h2, h3, h4, h5, h6 - hierarchical title
strong,em - emphasis
ins - insertion of
del - deletion of
abbr - abbreviation
code - code identification
cite - title of the work from which the citation is derived
q - quotation
blockquote - a paragraph or long quotation
ul - Unordered list
ol - Ordered list
dl,dt,dd - Defined list
[Recommendation] Tables should not be used for layout when CSS can achieve the same requirement.

3. Attributes
[Mandatory] Attributes must use lowercase letters, and their attribute values ​​must be surrounded by double quotes.
[Suggestion] Boolean type suggestions do not add attribute values. It is recommended that custom attributes be prefixed with xxx-, and data-

4 is recommended. DOCTYPE
[Mandatory] Use doctype to enable standard mode. It is recommended to use uppercase DOCTYPE

5. Language Encoding
[Recommended] Helps improve the accessibility of the page. The correct lang attribute must be set, for example: 46d1a6bdc802636878ae98bee68f7971
[Mandatory] The page must specify the character encoding meta, and must be the first direct child element of head, for example: e0b98727b7a8c35266df47956accb156.

6. CSS and JavaScript introduction
[Mandatory] When introducing css, you must specify rel="stylesheet", and when introducing css and javascript, you must specify the type attribute.
[Recommendation]Javascript code must be placed at the end of the page or loaded asynchronously.

7. Head content
[Mandatory] The Title tag must be set as a direct child element of the head and immediately after the charset statement.
[Mandatory] Favicon is guaranteed to be accessible, for example: eb8b05fa799a70a29c3eb6974a8ca0c3
[Mandatory] The Viewport attribute must be specified.

8. Pictures
[Mandatory] It is prohibited for the src value of img to be empty, and the default src attribute value must also be added to delayed-loaded pictures.
[Recommendation] Add alt attribute value to important images.
[Recommendation]Add width and height attributes to avoid page jitter.

9. Control title
[Mandatory] A control with a text title must use a label to associate it with its title, for example:

<label><input type="checkbox"name="confirm" value="on"> 我已确认上述条款</label>或<labelfor="user">用户：</label><inputtype="text" name="user" id="user">

10. Button
[ Mandatory] The type attribute value must be specified when using the button element

11. Accessibility
[Recommendation] When using JavaScript for form submission, the native submission function should be allowed to work properly.
[Recommendation] Specify the type attribute of the input box according to the content type, for example: 6e290236d7c77fdce98cb15bf0dfeea2

12. Multimedia
[Recommendation] Use audio and video tags to play When using audio and video, you should pay attention to the format:
Audio format: MP3, WAV, Ogg
Video format: MP4, WebM, Ogg

13. Note

[Mandatory]For The CSS and JavaScript code of the page or module must be commented in detail

Related recommendations:

Summary of changes in the page structure of html5 and adding and deleting tags

Example code of div tag in HTML5

The above is the detailed content of What are the tags and common rules in HTML5? Introduction to html5 tags and rules. For more information, please follow other related articles on the PHP Chinese website!