HTML5 page architecture element-& lt; header & gt; tag

When HTML4 became popular, most of the page Architecture elements were tables, which were convenient and convenient to use. (although it was not a real page architecture element ). After XHTML1.0, Everyone began to realize the error of table usage, so DIV stepped onto the architecture stage again. With the popularity of search engines, the structure page position of DIV is further stabilized. As a result, with the crazy web page reconstruction in the past few years, DIV + CSS is like the source of the Yangtze River.
With the in-depth research on the Web page architecture, the standard setting mechanism of HTML is not idle, and the common architectures of designers are combined. As a result, HTML5 now has these new page elements, they are <Header> tag
Let's first look at W3SCHOOL's definition: <Header>
<P> Welcome to... </p>
<H1> Red Hat! </H1>
</Header>

A friend who is familiar with the DIV architecture page can also understand this, which is the content in <div id = "header"> that we liked before. However, the difference here is that our <div id = "header"> previously defined is the header of the page, and the header here can be defined as the page level, it can also be defined as the header of other independent parts of the page. For example:
<Article>
<Header>
<H1> hongcaomao <P> application: <time pubdate = "pubdate"> 2012-01-01 </time> </p>
</Header>
<P> hello, header element... </p>
</Article>

Similarly, in the architecture page, header labels are generally placed on the top of the page, but if you want to place it on the left, right, or even bottom, it doesn't matter, A tag only defines its role on the page, rather than its position. Of course, there are more search engine optimization principles, and the important content is advanced at the end of the Architecture page.
Finally, because the header in HTML5 is a block element, it is best to define CSS if we want to use it in most mainstream browsers, as shown below.
Header {display: block ;}

After reading W3SCHOOL and my own understanding, let's take a look at the W3C definition of the header label.
A header element is intended to usually contain the section's heading (an h1-h6 element or an hgroup element), but this is not required. the header element can also be used to wrap a section's table of contents, a search form, or any relevant logos.
To put it simply, the header label is used to contain content that you use as a header or header.

 

From Red straw hat * Arain