首頁  >  文章  >  web前端  >  淺析HTML5中header標籤的用法

淺析HTML5中header標籤的用法

黄舟
黄舟原創
2017-02-23 14:23:032501瀏覽

1aa9e5d373740b65a0cc8f0a02150c53標籤定義文件的頁眉,通常是一些引導和導航資訊。它不限於寫在網頁頭部,也可以寫在網頁內容裡面。
在新的標準中header標籤定義如下:

"A group of introductory or navigational aids.」
基本上意思是「一組介紹性的護著導航相關的輔助內容」。字面上理解header標籤不單單只是定義頁頭內容,也可以定義頁頭以下其它內容的介紹。這和我們傳統的頁面header定義並不完全一致。
通常1aa9e5d373740b65a0cc8f0a02150c53標籤至少包含(但不局限於)一個標題標記(4a249f0d628e2318394fd9b75b4636b1-4e9ee319e0fa4abc21ff286eeb145ecc),還可以包括d8eccd9ed644b68a6460a2bb84548c82標籤,還可以包括表格內容、標誌、搜索表單、c787b9a589a3ece771e842a6176cf8e9導覽等。

<header>  

     <h1>雨打浮萍</h1>  

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

    </header>  

    <article>  

     <header>  

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

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

     </header>  

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

    </article>



在上面的結構中,我們可以看到使用header我們定義了一篇文章的標題和內容。這裡header標籤的使用並不是頁面的頁頭,而是文章的頁頭。

所以在HTML5中,header的使用更加靈活,你可以根據你的需求來定義和組織document結構。

同樣,在架構頁面時,header標籤一般都放在頁面的頂部,但是如果你想把他放在左側,右側甚至底部都沒有關係,標籤只定義了本身在頁面的角色,而不是位置。當然更具搜尋引擎優化原則,重要內容最後在架構頁面的時候提早。
最後由於在HTML5中header屬於區塊元素,如果我們要在大多數主流瀏覽器使用的話最好定義CSS,如下。

header { display:block;}

           

 以上是您在淺析HTML5中header標籤的用法 的內容,更多相關內容請關注PHP中文網(www.php.cn)! 

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn