首頁 >web前端 >H5教程 >html5 section標籤是什麼意思? html5 section標籤的用法總結

html5 section標籤是什麼意思? html5 section標籤的用法總結

寻∝梦
寻∝梦原創
2018-08-29 16:36:3823414瀏覽

本篇文章主要的介紹了關於HTML5 section標籤的定義以及它的用法,最後還有一個案例總結,現在讓我們開始閱讀這篇文章吧

##先來解釋下html5 section標籤的意思:

html5 section標籤定義了文件中的節(section、區段)。例如章節、頁首、頁尾或文件中的其他部分。

看一個實例讓你更了解section標籤:

文件中的區段,解釋了PRC:

<section>
  <h1>PHP中文网</h1>
  <p>这里是PHP中文网,网址是www.php.cn</p>
</section>

實例效果如下圖:

html5 section標籤是什麼意思? html5 section標籤的用法總結

現在說說section標籤的注意點:

section 不是一個專用來做容器的標籤,如果只是用於設定樣式或腳本處理,專用的是div

section 裡應該有標題(h1~6),但文章中推薦用article 來代替

一條簡單的準則是,只有元素內容會被列在文件大綱中時,才適合用section元素。

section的作用是將頁面上的內容分塊,例如各個有標題的版塊、功能區或對文章進行分段,不要與有自己完整、獨立內容的article混淆。

html5 section標籤的用法:

html5引入了
標籤,用來描述文件的結構,它同
標籤的意思一樣。但是在特定環境中,兩者又有明顯的差異。

w3對
的定義是:定義一個文檔的章節(可以擁有自己的
)。

w3對
的定義是: 定義一個文件的章節。 (但似乎更適合用於外層的佈局,缺少語義性。)

現在來看一個案例:

<body>
  <header></header>
  <div id=“content”>
     <section></section>
     <section></section>
  </div>
  <footer></footer>
</body>

在這裡,我們用
改成
,因為這裡還不能明顯的區分兩者的區別:

<section id=”content”>
   <section></section>
   <section></section>
</section>

或:

<div id=”content”>
   <div></div>
   <div></div>
</div>

HTML5 section標籤的總結:

我們用
標籤來佈局整個最外層的章,而用
用來定義內部的章節。當然如果把整個文件都看作是一個章節,那麼也可以用
來代替
,但是建議不要使用
來代替該用
佈局的地方,那些地方不能體現出
的語意性。

【小編推薦】

如何為html中的pre標籤中的文字換行? html pre標籤的使用實例

HTML iframe標籤怎麼使用? HTML iframe標籤的使用實例介紹

以上是html5 section標籤是什麼意思? html5 section標籤的用法總結的詳細內容。更多資訊請關注PHP中文網其他相關文章!

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