溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

HTML5中的article標簽怎么用

發(fā)布時間：2020-12-05 10:40:22 來源：億速云 閱讀：239 作者：小新 欄目：web開發(fā)

這篇文章主要介紹了HTML5中的article標簽怎么用，具有一定借鑒價值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

HTML5中的article標簽解釋：

這個標簽在HTML5中，意思應(yīng)該是取代DIV結(jié)構(gòu)的，它定義了一個大的外部框架，就像你我們經(jīng)常定義的最外層的那對DIV意思一樣，現(xiàn)在有了這些自己具有層級結(jié)構(gòu)的不同標記了。

所以article的下面應(yīng)該還包括很多其它標簽。結(jié)合后實現(xiàn)分欄之類的設(shè)計，CSS也根據(jù)這個做了調(diào)整以便支持其樣式的顯示，同時JS也需要些變動，JQuery則依然活躍，并沒有因為HTML5重復(fù)了其部分功能而被排擠掉

在HTML5中相對于以往版本的文檔書寫方面，追加了一些標簽。如頁眉、頁腳、內(nèi)容區(qū)等等的元素結(jié)構(gòu)。其中在主體結(jié)構(gòu)元素中增加了article及section元素。那么他們兩個有什么區(qū)別呢，什么時候用article，什么是用section

想了解HTML5中的sention：HTML5中的section標簽是什么？HTML5中的section標簽怎么居中？

article元素代表了文檔、頁面或者是應(yīng)用程序當中的獨立完整可以被外部引用的內(nèi)容，他可以以一篇文章、一篇帖子、一段評論或者是獨立的插件形式出現(xiàn)。除了內(nèi)容主題以外，一個article元素通常會有自己的標題及腳注。

HTML5中article標簽的定義和用法：

<article> 標簽定義外部的內(nèi)容。

外部內(nèi)容可以是來自一個外部的新聞提供者的一篇新的文章，或者來自 blog 的文本，或者是來自論壇的文本。亦或是來自其他外部源內(nèi)容。

有實例：

<article>
<a href="http://www.apple.com">Safari 5 released</a><br />
7 Jun 2010. Just after the announcement of the new iPhone 4 at WWDC, 
Apple announced the release of Safari 5 for Windows and Mac......
</article>

article為可以嵌套的元素，原則上需article內(nèi)層應(yīng)與外層的內(nèi)容相關(guān)聯(lián)，例如一篇文章的正文及對正文的評論就可以同過article進行嵌套。

其中section將正文及評論進行了區(qū)分，他是一個分塊區(qū)的元素，下一課會講解到。article有很完整及獨立的將評論的每一條都進行了分割。

article還能用來表示一個插件，下面是一個允許全屏的代碼，他的作用就是讓這個插件看上去像完全內(nèi)嵌在網(wǎng)頁里面一樣。

HTML5中article標簽的標準屬性：

class, contenteditable, contextmenu, dir, draggable, id, irrelevant,

lang, ref, registrationmark, tabindex, template, title

這里使用article標簽布局一篇實例，通過此示例掌握了解article元素標簽。

完整HTML5實例代碼：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>article 實例 ThinkCSS</title>
<style>
article{ color:#000}
article h2{ color:#F00}
</style>
</head>
<body>
<article>
    <h2>文章標題</h2>
    <p>文章段落一，內(nèi)容CSS技術(shù)上ThinkCSS網(wǎng) ...</p>
    <p>文章段落二，內(nèi)容CSS技術(shù)上ThinkCSS網(wǎng) ...</p>
    <p>段落三，內(nèi)容CSS技術(shù)上ThinkCSS網(wǎng) ...</p>
</article>
</body>
</html>

提示和注釋：

注釋：<article> 標簽的內(nèi)容獨立于文檔的其余部分。

【元素有話說】

article：

感謝你能夠認真閱讀完這篇文章，希望小編分享HTML5中的article標簽怎么用內(nèi)容對大家有幫助，同時也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，遇到問題就找億速云，詳細的解決方法等著你來學習!

向AI問一下細節(jié)

免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手