A brief analysis of the usage of header tags in HTML5

The

tag defines the header of the document, usually some guidance and navigation information. It is not limited to being written in the header of the web page, but can also be written in the content of the web page.
In the new standard, the header tag is defined as follows:

"A group of introductory or navigational aids."
Basically means "a group of introductory navigation-related auxiliary content." Literally understood, the header tag not only defines the content of the page header, but can also define the introduction of other content below the page header. This is not completely consistent with our traditional page header definition.
Usually the

tag contains at least (but is not limited to) a header tag (

-

), and can also include the

tag, and can also include table content, logo, search Forms,

navigation, etc.

<header>  

     <h1>雨打浮萍</h1>  

     <p>专注于web前端开发</p>  

    </header>  

    <article>  

     <header>  

      <h1>html5语义化标签之结构标签</h1>  

      <p>article、section、hgroup、aside、nav...</p>  

     </header>  

     <p>...这里面包含很多东西...</p>  

    </article>

In the above structure, we can see that using header we define the title and content of an article. The header tag used here is not the header of the page, but the header of the article.

So in HTML5, the use of headers is more flexible, and you can define and organize the document structure according to your needs.

Similarly, when structuring a page, the header tag is generally placed at the top of the page, but if you want to place it on the left, right or even bottom, it doesn’t matter. The tag only defines its location on the page. Role, not location. Of course, it is more based on search engine optimization principles. Important content is finally advanced when structuring the page.
Finally, since header is a block element in HTML5, if we want to use it in most mainstream browsers, it is best to define CSS, as follows.

header { display:block;}

                 

The above is a brief analysis of the usage of header tags in HTML5. For more related content, please pay attention to the PHP Chinese website (www.php.cn)!