Shulou(Shulou.com)06/03 Report--

Editor to share with you the example analysis of semantic tags in HTML5, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!

In the HTML5 standard, several new tags have been added to add page semantics, such as article, section, nav and aside. Unlike most other tags, browsers interpret and render these tags only as normal div block-level elements without adding any additional presentation logic; that is, these tags are only used to add semantics. For Web publishers, the practical significance of using these tags has two main points: search engine optimization and increasing page availability (accessibility).

In element classification, article, section, nav and aside are called "Sectioning Content".

Article

The article element can be used to represent an independent piece of content on a page, which can be an article, a post / comment on a forum, a blog, an interactive control, and so on. Article tags can be nested, and when doing so, the child article element must be logically associated with the parent article element. For example, Web developers can take the body and comments of a blog as parent article elements, and each comment as child article elements.

The main element cannot appear inside the article element-the main element refers to the main content of the page, and when there is a main element, the article element exists as a child of the main element.

Section

The section element refers to a part of a page or Web application, and the "theme" or "tone" of different section should be different from each other. This "theme" / "tone" is generally defined by placing a heading element (h2-h7) within the section element.

It is a mistake to use section as div-child elements of section should not assume any other roles (styles, behaviors, auxiliary tags, etc.) other than what can be displayed on the page.

Nav

The nav element is mainly used to contain navigation links on the page, so it is very common to include ul or ol elements directly in the nav element. However, there can be no ul or ol elements in the nav, such as an article paragraph (p tag) in the nav element and links (a tag) in the article paragraph.

Like the article element, the main element cannot appear inside the nav element.

Aside

The aside element is generally used to represent the sidebar on a page, but it only semantically represents the "sidebar", and the browser will only treat it as a normal div block-level element when parsing and rendering the tag. If you want to really get the effect of the sidebar, Web developers need to write their own CSS to achieve it.

The above is all the content of the article "sample Analysis of semantic tags in HTML5". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.