小編給大家分享一下HTML5中article和section有什么區(qū)別，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)是一家朝氣蓬勃的網站建設公司。公司專注于為企業(yè)提供信息化建設解決方案。從事網站開發(fā)，網站制作，網站設計，網站模板，微信公眾號開發(fā)，軟件開發(fā)，微信小程序開發(fā)，十多年建站對公路鉆孔機等多個行業(yè)，擁有多年的網站營銷經驗。

內容區(qū)塊是指將HTML頁面按邏輯分割后的單位。對于頁面網站來說，導航菜單、文章正文、文章的評論等每一個部分都可稱為內容區(qū)塊。

article元素

article元素代表文檔、頁面或應用程序中獨立的、完整的、可以獨自被外部引用的內容。它可以是一篇博客或報刊中的文章、一篇論壇帖子、一段用戶評論或獨立的插件，或其他任何獨立的內容。除了內容部分，一個article元素通常有它自己的標題（一般放在一個header元素里面），有時還有自己的腳注。

<article>     
<header>         　　　　
<h2>標題</h2>          
<p>發(fā)表日期：<time pubdate="pubdate">2010/10/10</time></p>　　
</header>
　　<p>article的使用方法</p>      　　
　　<footer>           
　　<p><small>Copyright @ yiiyaa.net All Rights Reserverd</samll></p>　　
　　</footer>
　　</article>

注：article元素是可以嵌套使用的，內層的內容在原則上需要與外層的內容相關聯(lián)。例如，一篇博客文章中，針對該文章的評論就可以使用嵌套article元素的方式；用來呈現(xiàn)評論的article元素被包含在表示整體內容的article元素里面。
嵌套的代碼如下：

<article>
　　<header>
            <h2>article元素使用方法</h2>
　　　　<p>發(fā)表日期：<time pubdate="pubdate">2010/10/10</time></p>
　　</header>
　　<p>此標簽里顯示的是article整個文章的主要內容，，下面的section元素里是對該文章的評論</p>
　　<section>
            <h3>評論</h3>
　　　　<article>
                  <header>
　　　　　　　　<h4>發(fā)表者：maizi</h4>
　　　　　　　　<p><time pubdate datetime="2016-6-14">1小時前</time></p>
　　　　　　</header> 
　　　　　　<p>這篇文章很不錯啊，頂一下！</p>
           </article>
　　　　<article>
                  <header>           
　　　　　　　　<h4>發(fā)表者：小妮</h4>
                        <p><time pubdate datetime="2016-6-14T:21-26:00">1小時前</time></p>
　　　　　　</header>
　　　　<p>這篇文章很不錯啊，對article解釋的很詳細</p> 
　　　　</article>
      </section>
</article>

示例內容分為幾個部分，文章標題放在了header元素中，文章正文放在了header元素后面的p元素中，然后section元素把正文與評論進行了區(qū)分（是一個分塊元素，用來把頁面中的內容進行區(qū)分），在section元素中嵌入了評論的內容，評論中每一個人的評論相對來說又是比較獨立的、完整的，因此對它們都使用一個article元素，在評論的article元素中，又可以分為標題與評論內容部分，分別放在header元素與p元素中。

1、section元素用于對網站或應用程序中頁面上的內容進行分塊，section元素的作用是對頁面上的內容進行分塊，或者說對文章進行分段，；

2、一個section元素通常由內容及其標題組成。通常不推薦為那些沒有標題的內容使用section元素，

3、section元素并非一個普通的容器元素；當一個內容需要被直接定義樣式或通過腳本定義行為時，推薦使用p而非section元素；

4、如果article、nav、aside元素都符合某條件，那么就不要用section元素定義；

5、section元素中的內容可以單獨存儲到數(shù)據(jù)庫中或輸出到word文檔中。

<section>
　　　<h2>section元素的</h2>標題
　　　<p>section區(qū)塊的主題部分</p>
　</section>

在HTML5中，你可以將所有頁面的從屬部分，譬如導航條、菜單、版權說明等包含一個統(tǒng)一的頁面中，以便統(tǒng)一使用CSS樣式來進行裝飾。最后，關于section元素的使用禁忌總結如下：

1）不要將section元素用作設置樣式的頁面容器，那是p元素的工作。

2）如果article元素、aside元素或nav元素更符合使用條件，不要使用section元素。

3）不要為沒有標題的內容區(qū)塊使用section元素。

三、兩者的區(qū)別：

以上講述了那么多，兩者的區(qū)別到底是什么呢？事實上，在HTML5中，article元素可以看成是一種特殊類型的section元素，它比section元素更強調獨立性。即section元素強調分段或分塊，而article強調獨立性。具體來說，如果一塊內容相對來說比較獨立的、完整的時候，應該使用article元素，但是如果你想將一塊內容分成幾段的時候，應該使用section元素。另外，在HTML5中，p元素變成了一種容器，當使用CSS樣式的時候，可以對這個容器進行一個總體的CSS樣式的套用。

以上是“HTML5中article和section有什么區(qū)別”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

網頁名稱：HTML5中article和section有什么區(qū)別-創(chuàng)新互聯(lián)
本文地址：http://chinadenli.net/article40/dgjheo.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供云服務器、標簽優(yōu)化、品牌網站設計、網站建設、用戶體驗、App設計

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)