Several of the most common HTML5 elements used to replace Div

Although most of html5 functional elements, such as <video> <canvas> <audio>, are not supported by mainstream browsers (mainly Internet Explorer ), however, we can safely use at least those Layout-related elements when combined with html5.js, such as

Articles and sections

The article element is an independent part of the document. This label should be used for blog entries, articles, or other text-based content. Basically, you can use this label extensively to construct text parts of a page.

The section element is the most misleading element, because it is thought to be used to replace the div element, but this is not the case. In fact, the relationship between section elements and article elements is very close. For example, sections in an article can be distinguished by section labels. In general, this label is mainly used to divide the content of the page into several areas with internal relationships.

Header and Footer

The two elements represent the header and the bottom of the page. However, in other words, these two elements represent not only the headers and bottoms of pages in the traditional sense. In fact, they can be applied more flexibly in various parts of the page.

Nav

The nav element mainly refers to the navigation menu part of the page, which can contain hyperlinks that can be linked to other parts of the page. Remember to use this label in the navigation area of the page.

Figure and Figcaption

According to w3c, these two elements are used to indicate the parts that are not in the main document stream but are closely related to the document content, in fact, it mainly refers to charts, images, data references, and other things that can better reflect the content of the document, and the deletion does not affect the content of the main document. Figcaption is the title of these multimedia elements.

Aside

The aside element refers to the areas that are separated from the main document topic or have little relationship with the content of the main document. A typical application is the sidebar of the page.

Then, when constructing the page, let's think about it and see which divs can be replaced by the above labels. If you can't find the element of the Right Sn, use div, because div is not abolished in HTML5, but its function is weakened. By the way, do not forget to add html5.js to browsers that do not support html5 tags!