一、HTML5新增標簽
1.
<article>標簽：定義外部的內容。比如來自一個外部的新聞提供者的一篇新的文章、或者來自 blog 的文本、或用戶評論、或者是來自論壇的文本。亦或是來自其他外部源內容。
1 <article> 2 <h1>Internet Explorer 9</h1> 3 <p>Windows Internet Explorer 9（簡稱 IE9）於 2011 年 3 月 14 日發布.....</p> 4 </article>
2.
<aside>標簽：定義其所處內容之外的內容，aside 的內容應該與附近的內容相關。
1 <p>這個夏天我和父親去了歐洲旅游。</p> 2 <aside> 3 <h4>歐洲介紹</h4> 4 歐洲，，是是是Bla。。。 5 </aside>
3.
<datalist> 標簽：定義可選數據的列表。與 input 元素配合使用，就可以制作出輸入值的下拉列表。
4.
<details> 標簽：用於描述文檔或文檔某個部分的細節
5.
<summary> 標簽：包含 details 元素的標題，”details” 元素用於描述有關文檔或文檔片段的詳細信息。”summary” 元素應該是 “details” 元素的第一個子元素
1 <details open="open"> /*open屬性定義在 HTML 頁面上 details 應該是可見的*/ 2 <summary>HTML 5</summary> 3 This document teaches you everything you have to learn about HTML 5. 4 </details>
6.
<figure> 標簽：用於對元素進行組合。使用 <figcaption> 元素為元素組添加標題。<figure> 標簽規定獨立的流內容（圖像、圖表、照片、代碼等等）。figure 元素的內容應該與主內容相關，但如果被刪除，則不應對文檔流產生影響
7.
<figcaption> 標簽：定義 figure 元素的標題（caption）。 "figcaption" 元素應該被置於 "figure" 元素的第一個或最后一個子元素的位置
1 <figure> 2 <figcaption>黃浦江上的的盧浦大橋</figcaption> 3 <img src="/i/shanghai_lupu_bridge.jpg" width="350" height="234" /> 4 </figure>
8.
<footer> 標簽：定義 section 或 document 的頁腳。典型地，它會包含創作者的姓名、文檔的創作日期以及/或者聯系信息
1 <footer> 2 <p>made by someone</p> 3 <p>聯系方式：: <a href="mailto:someone@qq.com">someone@qq.com</a>.</p> 4 </footer>
9.
<header> 標簽：定義 section 或 document 的頁眉，和footer標簽相似
1 <header> 2 <h1>Welcome to my homepage</h1> 3 <p>My name is someone</p> 4 </header>
10.
<hgroup> 標簽：用於對網頁或區段（section）的標題進行組合
1 <section> 2 <hgroup> 3 <h1>this is h1 of my article</h1> 4 <h2>this is h2 of my article</h2> 5 </hgroup> 6 <p>The rest of the content...</p> 7 </section>
11.
<mark>標簽：主要用來在視覺上向用戶呈現那些需要突出的文字。<mark>標簽的一個比較典型的應用就是在搜索結果中向用戶高亮顯示搜索關鍵詞。<mark> 標簽定義帶有記號的文本。請在需要突出顯示文本時使用 <m> 標簽，<m> 標簽也是H5的新標簽，定義帶有記號的文本
1 <p>Do not forget to buy <mark>milk</mark> today.</p>
12.
<nav> 標簽：定義導航鏈接的部分
1 <nav> 2 <a href="/html/index.asp">Home</a> 3 <a href="/html/html_intro.asp">Previous</a> 4 <a href="/html/html_elements.asp">Next</a> 5 </nav>
13.
<meter> 標簽：定義已知范圍或分數值內的標量測量。也被稱為 gauge（尺度）。
例子：磁盤用量、查詢結果的相關性，等等。Firefox, Chrome, Opera 以及 Safari 6 支持 <meter> 標簽，Internet Explorer 不支持 meter 標簽
1 <meta http-equiv=”refresh” content=”3”;url=http://sina.com.cn” /> 設置3秒自動刷新
14.表單
input常用類型
- type = text 輸入類型是text，這是我們見的最多也是使用最多的，比如登陸輸入用戶名，家庭住址等等。是input的默認類型，其參數有name(表示該文本輸入框名稱)，maxlength(輸入框中允許輸入字符的最大數),value(輸入框中的默認值)，readonly(表示該框中只能顯示，不能添加修改),disabled(表示該框禁用)。
1 <input type="text" name="name" maxlength="10" value="請在此輸入十個字母">//長度大於10后，便不能增加輸入框的value值了
1 <input type="text" name="name" maxlength="20" placeholder="請在此輸入十個字母">
注意：value和placeholder的區別1 <input type="text" name="name" maxlength="20" placeholder="請在此輸入十個字母" readonly="true">//此時的輸入框為只讀狀態，不能獲取焦點，不能寫入內容
1 <input type="text" name="name" maxlength="20" placeholder="請在此輸入十個字母" disabled="disabled">
注意：readonly只針對input(text / password)和textarea有效，而disabled對於所有的表單元素都有效，包括select, radio, checkbox, button等 - type = password 密碼輸入框，最大的區別就是當在此輸入框輸入信息時顯示為保密字符
1 <input type="password" >
- type=file 上傳文件的輸入框
<input type="file" >
- type=hidden 稱為隱藏域：如果一個非常重要的信息需要被提交，但又不能或者無法明示的時候使用
- type=button 作為功能按鈕，使用value屬性設置按鈕內的文字
<input type="button" value="click me" >
- type=checkbox 多選框，常見於注冊時選擇愛好、性格、等信息
1 <form> 2 <label for="cb0">籃球：</label> 3 <input type="checkbox" name="checkit" id="cb0" value="a" checked><br> 4 <label for="cb1">足球：</label> 5 <input type="checkbox" name="checkit" id="cb1" value="b"><br> 6 <label for="cb2">游泳：</label> 7 <input type="checkbox" name="checkit" id="cb2" value="c"><br> 8 <input type="submit" /> 9 </form>
- type=radio 單選框，出現在多選一的頁面設定中
<label>性別：</label> <input type="radio" name="sex">男 <input type="radio" name="sex">女 //name一定要相同，否則實現不了多選一的功能
- type=submit 提交按鈕
- type=reset 重置按鈕