HTML <!DOCTYPE> 標簽
<!DOCTYPE> 聲明必須是 HTML 文檔的第一行师倔，位于 <html> 標簽之前赏陵。
<!DOCTYPE> 聲明不是 HTML 標簽送火；它是指示 web 瀏覽器關(guān)于頁面使用哪個 HTML 版本進行編寫的指令联贩。
請始終向 HTML 文檔添加 <!DOCTYPE> 聲明烈钞，這樣瀏覽器才能獲知文檔類型泊碑。
<!DOCTYPE html>
<html>
<head>
<title>文檔的標題</title>
</head>
<body>
文檔的內(nèi)容......
</body>
</html>
<header> 標簽
<header> 標簽定義文檔的頁眉（介紹信息）。
<header>
<h1>歡迎來到我的主頁</h1>
<p>我叫繼小鵬</p>
</header>
<footer> 標簽
<footer> 標簽定義文檔或節(jié)的頁腳毯欣。
<footer>
<p>發(fā)布者: huanghanlian</p>
<p>聯(lián)系信息: <a href="http://www.huanghanlian.com/</a>.</p>
</footer>
<section> 標簽
<section> 標簽定義文檔中的節(jié)（section馒过、區(qū)段）。比如章節(jié)仪媒、頁眉沉桌、頁腳或文檔中的其他部分。
<section>
<h1>PRC</h1>
<p>The People's Republic of China was born in 1949...</p>
</section>
<article> 標簽
<article> 標簽規(guī)定獨立的自包含內(nèi)容算吩。
一篇文章應(yīng)有其自身的意義留凭，應(yīng)該有可能獨立于站點的其余部分對其進行分發(fā)。
<article> 元素的潛在來源：
- 論壇帖子
- 報紙文章
- 博客條目
- 用戶評論
<article>
<h1>Internet Explorer 9</h1>
<p>Windows Internet Explorer 9（簡稱 IE9）于 2011 年 3 月 14 日發(fā)布.....</p>
</article>
<figure> 標簽
<figure> 標簽規(guī)定獨立的流內(nèi)容（圖像偎巢、圖表蔼夜、照片、代碼等等）压昼。
<figure>
<p>黃浦江上的的盧浦大橋</p>
</figure>
<address> 標簽
<address>
Written by <a >繼小鵬</a>.<br>
Visit us at:<br>
prc
</address>
Paste_Image.png
使用html5語義化標簽
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
header{
}
</style>
</head>
<body>
<!-- 頭部 -->
<header>
<!-- 頭部標題 -->
<h1>HTML5時代</h1>
<!-- 頭部標題end -->
<!-- 導(dǎo)航 -->
<nav>
<ul>
<li>
<a href="#">首頁</a>
</li>
<li>
<a href="#">活動</a>
</li>
<li>
<a href="#">話題</a>
</li>
<li>
<a href="#">社區(qū)·</a>
</li>
</ul>
</nav>
<!-- 導(dǎo)航end -->
</header>
<!-- 頭部end -->
<!-- 部分片段section -->
<!-- 介紹 -->
<section id="idea">
<div>
<h2>HTML5時代</h2>
<p>通過我們的 HTML 編輯器求冷，您能夠編輯 HTML，然后點擊按鈕來查看結(jié)果窍霞。</p>
</div>
</section>
<!-- 介紹end -->
<!-- 活動幻燈片 -->
<section id="activity">
<!-- 活動上部 -->
<div class="up">
<!-- 活動區(qū)域日歷控件 class命名為左側(cè) -->
<div id="calendar" class="left_part"></div>
<!-- 活動區(qū)域日歷控件end class命名為左側(cè) -->
<!-- 右側(cè) 信息info -->
<div id="info" class="right_part">
<!-- 公告bulletin -->
<div id="bulletin">
<!-- 公告標題 -->
<h3>公告欄</h3>
<!-- 公告標題 end -->
<p>輸入替換內(nèi)容后匠题，替換所有匹配關(guān)鍵字。(NOTE: 注意此時如果鼠標焦點在編輯窗口中</p>
</div>
<!-- 公告bulletin end -->
</div>
<!-- 右側(cè) 信息info end -->
</div>
<!-- 活動上部end -->
<!-- 活動下部 -->
<div class="dowm">
<h3>發(fā)現(xiàn)活動</h3>
<!-- 活動區(qū)域輪播圖控件 -->
<div id="act_slides"></div>
<!-- 活動區(qū)域輪播圖控件end -->
</div>
<!-- 活動下部end -->
</section>
<!-- 活動幻燈片end -->
<!-- 正文部分 -->
<section id="post">
<h3>社區(qū)文章</h3>
<!-- 左側(cè) -->
<article id="posts">
<applet class="item">
<figure></figure>
<div class="header">
<h4>
<a href="#" title="常用表達式">常用表達式</a>
<span>作者:黃繼鵬<time>2017-10-12 19:05</time></span>
</h4>
</div>
<div class="body"></div>
<div class="footer"></div>
</applet>
</article>
<!-- 左側(cè)end -->
<!-- 右側(cè) -->
<article id="others"></article>
<!-- 右側(cè)end -->
</section>
<!-- 正文部分end -->
<!-- 部分片段section end -->
<!-- 頁腳 -->
<footer>
<ul></ul>
<address></address>
</footer>
<!-- 頁腳end -->
</body>
</html>
<section>用來劃分網(wǎng)頁但金，但是不能用它進行布局韭山，這是W3C推薦的要求。布局推薦使用<div>
關(guān)于布局盡量用class,如果根后臺相關(guān)可以用id
