About the difference between section tags and div tags in HTML5 (there are instances in it)

This article mainly wants to introduce you about the HTML5 section label and div tag differences, the use of sections and div seems similar, but not too much difference, some places can be converted to each other, but some places can only use section or div, can not be converted , okay, let's read the article together.

Let's take a look at the section tag's HTML standard:

Each section corresponds to a different theme. Attention is the subject of the content itself, not the other human-defined partitioning criteria.

Examples of sections include the chapter headings of a book, each tab page of a Multi-tab dialog box, and a numbered section of a paper. The homepage of the site may be divided into sections such as introductions, latest content, contact information, and so on.

Note: page authors should use article instead of section elements if their content is for aggregation (syndicate). such as blog on the home page of each blog. Also such as forum posts on the first floor, the second floor, the third floor ... n floor. Typically, each part of the content is similar in form, but the source is independent.

Note: section is not a generic container element. If it is just for styling or scripting, apply the DIV element. A simple guideline is that only the element content is listed in the document outline when it is appropriate to use the section element.

Now let's talk about the difference between the HTML5 section tag and the div tag:

1.section is not a dedicated container to do the label, dedicated to the DIV

The section should have a title (h1~6), but the article recommends using article instead

We can understand it as a non-article paragraph, a special module container with a definite ID (not a container dedicated to wrap blocks).

In other words, in general, as an element container, using a div instead of a section, is the section useless? The pattern Tucson broken.

Using section in this case is better than div

section, as the name implies, is a chapter, such as:

<section>
As for why to use, is for the semantics, there is section, article, DL see this much comfortable, people or understand, computer or understanding, better than an eyeful div.

2. One of the most common mistakes people make in labeling is that HTML5 <section> equivalent to <div>--specifically, is used directly as a substitute (for styling).

<section> is not a style container. The section element represents the semantic part of the content that is used to help build a document profile. It should consist of a head. If you're looking for an element to use as a page container (like HTML or XHTML style), consider writing the style to the BODY element, as Kroc Camen says. If you still need an extra style container, continue with the Div bar.

Div is generic, supported by all browsers, section is H5 semantically labeled,<section></section> and <div class= "sections" ></div> Can be understood as a meaning, but the former is the H5

A summary of section tags and div tags in HTML5:

DIV: This tag has always been the most, most used label we've ever seen. It has no semantics of its own, and is used as a layout and styling tag.

Section: Similar to a Div, but it has further semantics. A section is used as a thematic piece of content, usually with a title in it. A typical application scenario for a section should be a chapter in an article, a tab in a label dialog box, or a numbered part of a paper.