首頁 > web前端 > H5教程 > HTML5中的article標籤是什麼? HTML5的article元素用在什麼地方?

HTML5中的article標籤是什麼? HTML5的article元素用在什麼地方?

寻∝梦
發布: 2018-08-15 13:29:09
原創
16652 人瀏覽過

HTML5中的article標籤是什麼? HTML5的article元素用在什麼地方?本篇文章主要為大家解釋了什麼是HTML5中的article標籤,article用在什麼地方,還有HTML5中article標籤的標準屬性有哪些。讓我們一起來看看。 (文末有元素有話說article標籤的自我介紹)

#HTML5中的article標籤解釋:

這個標籤在HTML5中,意思應該是取代DIV結構的,它定義了一個大的外部框架,就像你我們經常定義的最外層的那對DIV意思一樣,現在有了這些自己具有層級結構的不同標記了。

所以article的下面應該還包括很多其它標籤。結合後實現分欄之類的設計,CSS也根據這個做了調整以便支持其樣式的顯示,同時JS也需要些變動,JQuery則依然活躍,並沒有因為HTML5重複了其部分功能而被排擠掉

在HTML5中相對於以往版本的文件書寫方面,追加了一些標籤。如頁首、頁尾、內容區等等的元素結構。其中在主體結構元素中增加了article及section元素。那他們兩個有什麼差別呢,什麼時候用article,什麼是用section

想了解HTML5中的sention:HTML5中的section標籤是什麼? HTML5中的section標籤怎麼居中?

article元素代表了文件、頁面或是應用程式當中的獨立完整可以被外部引用的內容,他可以以一篇文章、一篇貼文、一段評論或是獨立的插件形式出現。除了內容主題以外,一個article元素通常會有自己的標題及註腳。

HTML5中article標籤的定義與用法:

標籤定義外部的內容。

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

有實例:

<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內層應與外層的內容相關聯,例如一篇文章的正文及對正文的評論就可以同過article進行嵌套。

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

article還能用來表示一個插件,下面是一個允許全螢幕的程式碼,他的作用就是讓這個插件看起來像完全內嵌在網頁裡面一樣。

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 h1{ color:#F00}
</style>
</head>
<body>
<article>
    <h1>文章标题</h1>
    <p>文章段落一,内容CSS技术上ThinkCSS网 ...</p>
    <p>文章段落二,内容CSS技术上ThinkCSS网 ...</p>
    <p>段落三,内容CSS技术上ThinkCSS网 ...</p>
</article>
</body>
</html>
登入後複製

#提示與註解:

註解:

標籤的內容獨立於文件的其餘部分。

【元素有話說】

article:

同志們好,我是article,是特殊的section,我比section具有更明確的語義,是一個獨立的、完整的相關內容區塊的代表。一般來說, 我會有標題部分(通常包含在 header 內),有時也會 包含 footer 。雖然 section 也是帶有主題性的一塊內容,但是無論從結構上還是內容上來說,我本身就是獨立的、完整的,代表文檔、頁面或者應用程序中獨立完整的可以被外部引用的內容。例如:部落格中的一篇文章,論壇中的一個貼文或一段瀏覽者的評論等。因為article元素是一段獨立的內容,所以在article元素中,通常包含頭部(header元素)、底部(footer元素)。

【相關推薦】

HTML5中web是什麼? web儲存中的元素有哪些?

HTML IMG標籤的屬性是有哪些?了解IMG標籤的用法








以上是HTML5中的article標籤是什麼? HTML5的article元素用在什麼地方?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板