HTML5 – 1.基礎

時間 2019-11-06

標籤 html5 html 基礎欄目 HTML5 简体版

原文原文鏈接

新網頁結構

1.<header> 定義了文檔的頭部區域

2.<nav>標籤訂義導航連接的部分。html

3.<article>定義頁面獨立的內容區域。html5

4.<section>定義文檔中的節（section、區段）瀏覽器

5.<aside>定義頁面的側邊欄內容。ide

6.<footer>定義 section 或 document 的頁腳。搜索引擎

7.<hgroup> 標籤標籤用於對網頁或區段（section）的標題進行組合。編碼

8.<footer>定義一個文檔底部。spa

9.<address>定義文檔做者或擁有者的聯繫信息。.net

1.article

<article> 標籤規定獨立的自包含內容。3d

一篇文章應有其自身的意義，應該有可能獨立於站點的其他部分對其進行分發。代理

<article> 元素的潛在來源：

論壇帖子
報紙文章
博客條目
用戶評論

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <header>
        <h1>個人ARTICLE</h1>
        <p>建立時間：<time datetime="2015-07-12" pubdate="pubdate">2015-07-12</time></p>
    </header>
    <section>
        <h2>讀者評論：</h2>
        <article>
            <header>
                <h3>讀者：A</h3>
                <p>
                    <time datetime="2015-07-12 10:28:04" pubdate="pubdate">1小時前</time>
                </p>
            </header>
            <p>
                寫的很好！
            </p>
        </article>
        <article>
            <header>
                <h3>讀者：002</h3>
                <p>
                    <time datetime="2015-07-12 09:28:04" pubdate="pubdate">2小時前</time>
                </p>
            </header>
            <p>
               通常般拉
            </p>
        </article>
    </section>
    <footer>
        <small>參考footer!!~</small>
    </footer>
</body>
</html>

2.section
定義和用法

<section> 標籤訂義文檔中的節（section、區段）。好比章節、頁眉、頁腳或文檔中的其餘部分。

section 不單單是一個普通的容器標籤。當一個標籤只是爲了樣式化或者方便腳本使用時，應該使用 div 。通常來講，當元素內容明確地出如今文檔大綱中時，section 就是適用的。

<article>
        <hgroup>
            <h1>蘋果</h1>
            <h2>可口的,美味的水果!</h2>
        </hgroup>
        <p>蘋果是蘋果的蘋果樹的果實。</p>
        <section>
            <h1>紅色的美味</h1>
            <p>這些明亮的紅蘋果是最多見的發如今許多超市。</p>
        </section>
        <section>
            <h1>綠蘋果</h1>
            <p>這些多汁、綠蘋果作蘋果餡餅的餡。</p>
        </section>
    </article>

HTML5 中 div section article 的區別
http://www.qianduan.net/html5-differences-in-the-div-section-article/

3.aside

定義和用法

<aside> 標籤訂義其所處內容以外的內容。

aside 的內容應該與附近的內容相關。

<!DOCTYPE html>
<html>
<head>
    <meta charset="en" />
    <title></title>
</head>
<body>
    <p>我和個人家人今年夏天參觀了Epcot中心。</p>
    <aside>
        <h4>Epcot中心</h4>
        Epcot中心是一個主題公園在佛羅里達州的迪斯尼世界。
    </aside>
</body>
</html>

4.nav

定義和用法

<nav> 標籤訂義導航連接的部分。

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8" />
 5     <title></title>
 6 </head>
 7 <body>
 8     <h1>NAV使用方法</h1>
 9     <nav>
10         <ul>
11             <li>
12                 <a href="nav.html">首頁</a>
13             </li>
14         </ul>
15         <ul>
16             <li>
17                 <a href=" aside.html">aside頁面</a>
18             </li>
19         </ul>
20     </nav>
21 </body>
22 </html>

nav的用法

time

定義和用法

<time> 標籤訂義公曆的時間（24 小時制）或日期，時間和時區偏移是可選的。

該元素可以以機器可讀的方式對日期和時間進行編碼，這樣，舉例說，用戶代理可以把生日提醒或排定的事件添加到用戶日程表中，搜索引擎也可以生成更智能的搜索結果。

屬性	值	描述
datetime	datetime	規定日期 / 時間。不然，由元素的內容給定日期 / 時間。
pubdate	pubdate	指示 <time> 元素中的日期 / 時間是文檔（或 <article> 元素）的發佈日期。

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="utf-8" />
 5     <title></title>
 6 </head>
 7 <body>
 8     <time datetime="2008-02-14">情人節</time>
 9     <time datetime="2008-02-14">2月14</time>
10     <time datetime="2008-02-14">今天的時間</time>
11     <time datetime="2015-07-12T22:00">2015年7月12日晚上10點</time>
12     <time datetime="2015-07-12T22:00Z">UTC標準時間2015年7月12日晚上10點</time>
13     <time datetime="2015-07-12T22:00+8:00">中國時間2015年7月12日晚上10點</time>
14 </body>
15 </html>

TIME格式介紹

5.pubdate

定義和用法

pubdate 屬性指示 <time> 元素中的日期 / 時間是文檔（或最近的前輩 <article> 元素）的發佈日期。

<article>
<time datetime="2011-06-22" pubdate="pubdate"></time>
Hello world. This is an article....
</article>

6.header

標籤訂義及使用說明

<header> 標籤訂義文檔或者文檔的一部分區域的頁眉。

<header> 元素應該做爲介紹內容或者導航連接欄的容器。

在一個文檔中，您能夠定義多個 <header> 元素。

註釋：<header> 標籤不能被放在 <footer>、<address> 或者另外一個 <header> 元素內部。

7.hgroup

定義和用法

<hgroup> 標籤用於對網頁或區段（section）的標題進行組合。

8.footer

定義和用法

<footer> 標籤訂義文檔或節的頁腳。

<footer> 元素應當含有其包含元素的信息。

頁腳一般包含文檔的做者、版權信息、使用條款連接、聯繫信息等等。

您能夠在一個文檔中使用多個 <footer> 元素。

9.address

定義和用法

<address> 標籤訂義文檔或文章的做者/擁有者的聯繫信息。

若是 <address> 元素位於 <body> 元素內，則它表示文檔聯繫信息。

若是 <address> 元素位於 <article> 元素內，則它表示文章的聯繫信息。

<address> 元素中的文本一般呈現爲斜體。大多數瀏覽器會在 address 元素先後添加折行。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。

HTML5 – 1.基礎

新網頁結構

1.<header> 定義了文檔的頭部區域

2.section 定義和用法

HTML5 中 div section article 的區別

3.aside

定義和用法

定義和用法

定義和用法

定義和用法

標籤訂義及使用說明

定義和用法

定義和用法

定義和用法

2.section
定義和用法