Example tutorial on adding new tags and attributes in h5

Structural tag (construct tag) Mainly responsible for defining the context structure of the Web and ensuring the integrity of HTML documents. Such tags include the following. section. Used to express a part or chapter of a book, or a section within a chapter. In Web page applications, this tag can also be used for regional chapter description. hgroup Groups the titles of web pages or sections:. header. The header on the main body of the page, please note that it is different from the head tag. Here is a tip for beginners: the content in the head tag is often invisible, and the header tag is often among a pair of body tags. footer. The bottom of the page (footer). Usually, people will mark some relevant information of the website here, such as about us, legal statement, email information, administrative entrance, etc. nav. It is a label specially used for menu navigation and link navigation, and is the abbreviation of navigator. article. Used to represent the main content of an article, generally the area where text is concentrated-->

Level block tag (block tag) mainly completes the Web The division of page areas ensures effective separation of content. Such tags include the following. aside. Used to express notes, tips, sidebars, summaries, inserted quotes, etc. as content that supplements the main body. From a simple page display, it is the sidebar, which can be on the left or right. Looking at a part of a page, it is a summary. The figure tag specifies independent stream content and is usually used in conjunction with figcaption. code. Represents a block of code. dialog dialog tag is used with the dt dd tag-->

In-line semantic tags (in-line tags) mainly complete the reference and expression of the specific content of the Web page, and are the basis for rich content display. Such tags include the following. meter. Represents a value within a specific range, which can be used for salary, quantity, percentage, etc. max represents the maximum value, min represents the minimum value, and value represents the current value. time. Represents a time value, and the attribute datetime emphasizes the time progress. Used to represent the progress bar-->

video. The video tag is used to support and implement direct playback of video (including video stream) files, and supports buffer preloading and multiple video media formats, such as MPEG-4, OggV, and WebM. audio. Audio tag, used to support and implement direct playback of audio (audio stream) files, supports buffer preloading and -->

tag definition options list. Use this element in conjunction with an input element to define the possible values of the input. The datalist and its options are not displayed, it is just a list of valid input values. All major browsers support the tag, except Internet Explorer and Safari. -->

Interactive tags are mainly used for functional content expression. They will have certain content and data associations and are various Based on events, such tags include the following. menu. Mainly used for interactive menus (this was a deprecated and now re-enabled tag). command. Used to handle command buttons. -->

contextmenu In Html5, each element has a new attribute: contextmenu. contextmenu is the context menu, that is, a menu will appear when you right-click the element. menu To realize that a menu will appear when you right-click an element, you must also understand another new element in HTML5: menu. As the name suggests, menu defines the menu. The menu element attributes: type: menu type attribute. There are three values 1) context: context; 2) toolbar: toolbar; 3) list: list Menu items can be embedded inside, that is, &lt ;menuitem> . menuitem attributes: label: The name displayed by the menu item icon: The icon displayed on the left side of the menu item onclick: The event triggered by clicking the menu item Only supports Firefox browser-- >

Specifies whether the content of the element can be edited Attribute value: true -----The content of the element can be edited false ---- -Unable to edit the content of the element inherit -----Inherit the contenteditable attribute of the parent element When it is an empty string, the effect is the same as true. When the contenteditable status of an element is true (the contenteditable attribute is an empty string, or is true, or is inherit and its parent element status is true), it means that the element is editable. Otherwise, the element is not editable.

-->

Specifies whether the element can be dragged 3 enumeration values true specifies whether the element is draggable Dragging. false specifies that the element is not draggable. auto uses the browser's default features. -->

The hidden attribute is used to hide the element. Once this attribute is used, the element will not be displayed in the browser 2 Boolean values true specifies that the element is visible. false specifies that the element is invisible. -->

Example tutorial on adding new tags and attributes in h5

Related articles