H5標籤變化1(DTD、新增標籤：結構標籤，多媒體標籤，web應用標籤還有其他標籤、刪除標籤、重定義標籤)
html5約等於HTML+CSS+Javascript+API
- WebApp
HTML5新增了離線儲存、更豐富的表單、js執行緒、socket、標準擴充套件embed、css3...
- 流媒體與多媒體引擎
Audio、video、Canvas、webgl等等
- 搜尋引擎和無障礙領域
h5是唯一一個通吃PC、Mac、iPhone、Android等主流平臺的跨平臺語言。
- 標籤變化
DTD、新增的標籤、刪除的標籤、重定義的標籤
- 頁面佈局
新的頁面佈局、區別和意義
- 屬性變化
input、表單屬性、連結屬性、其他屬性
- HTML5展望
簡述API、簡述Canvas、移動端應用
支援H5的瀏覽器有：IE9+、Firefox、Opera、Sadari、Chrome
文件型別定義（DTD）:
DTD:可定義合法的xml文件構建模組，它使用一系列合法的元素來定義文件的結構。
在HTML中：DTD規定了標記語言的規則，這樣瀏覽器才能正確地呈現內容。
HTML5中：不基於SGML,所以不需要引用DTD.
新增的標籤：
- 結構標籤
- 多媒體標籤
- web應用標籤
- 其他標籤
結構標籤（塊狀元素）——有意義的div
<article> <header> <nav> <section> <aside> <hgroup> <figure>標記定義一組媒體內容以及它們的標題。<figcaption>定義figure元素的標題。<footer> <dialog>
<section> <hgroup> <h1>樹下的貓</h1> <h3>文/艾米</h3> <h4> 三頭王：異域王族，擁有蜘蛛頭、人頭、獅子頭的三頭大蜘蛛，修煉萬蛛魔功、獅子吼、無畏獅子印等，其中黃金三頭王為其王族，最為強大罕見 血凰獅：墮落血凰跟古僧一脈的“無畏獅子”結合的後代</h4> </hgroup> <aside> <a href="#se1">Section One</a> <a href="#se2">Section Two</a> <a href="#se3">Section Three</a> </aside> </section> <section> <figure> <figcaption>樹下的貓咪怎麼生存</figcaption> <div class="video">。。。</div> </figure> </section> <section>
- header/section/aside/article/footer 不要互相巢狀
- 級別高低：header/section/footer > aside/article/figure/hgroup/nav >div/figcaption 級別高的我們通常寫在外層，互不巢狀。
多媒體標籤：
<video> 標記定義一個視訊
<audio> 定義音訊內容
<source> 定義媒體資源
<body>
<!--autoplay="autoplay"自動播放 loop="-1"無限次自動播放 controls="controls"可拖動控制-->
<audio src="../source/passion.mp3" autoplay="autoplay" loop="-1" controls="controls">您的瀏覽器該退休了。</audio><!--如果瀏覽器不支援audio就會顯示文字-->
<audio autoplay="autoplay">
<source src="../source/passion.mp3" type="audio/mpeg"/>
</audio>
</body><video controls="controls" width="1024" height="768">
<source src="../source/pal4.mp4" type="video/mp4"/>
</video>
<video src="../source/pal4.mp4"></video>audio和video區別：audio是音訊，不存在寬度和高度。
<canvas> 標記定義圖片。
<embed>標記定義外部的可互動的內容或外掛，比如flash。
<embed src="../source/happybirthday.swf" type="" width="1024" height="768"/>web應用標籤：
- 狀態標籤：
- <meter> 狀態標籤（實時狀態顯示：氣壓、氣溫）
- <progress> 狀態標籤（任務過程：安裝、載入）
<meter value="180" min="20" max="380" low="200" high="240" optimum="220"></meter>
<meter value="220" min="20" max="380" low="200" high="240" optimum="220"></meter>
如果value=400,用js取得的值依舊是380.如果value=0,用js取得的值是20.
<meter value="0.75">75%</meter>
<progress value="30" max="100" >
<progress max="100"><!--條條會來回滾動-->progress的相容性：
<meter> Chrome、Opera
<progress> Chrome、Opera、Firefox
- 列表標籤
- <datalist> 為input標記定義一個下拉列表，配合option.
- <details> 標記定義一個元素的詳細內容，配合summary.
<input placeholder="請選擇你的手機品牌" list="phoneList"/>
<datalist id="phoneList">
<option value="iPhone">iPhone</option>
<option value="huawei">huawei</option>
<option value="oppo">oppo</option>
<option value="samsung">samsung</option>
<option value="meizu">meizu</option>
</datalist>相容性：
<datalist> Firefox、Opera
<details> 目前相容比較好的瀏覽器是chrome，有些高版本的瀏覽器也能相容。
<details>
<summary>書下的毛</summary>
<p>
<p>虛空王獸：異域中的至尊奇獸，掌控空間，是最強生靈之一，成長起來能成仙，其血統不純的後裔流落在九天被稱為虛空獸</p>
無畏獅子：古僧一脈護教聖獸，與白玉龍象並稱，擁有掌中僧國祕術，之後和墮落血凰一起叛走異域。當代第一天驕被荒所擒被迫成為坐騎，古祖已被蛄祖斬殺
墮落血凰：仙卵被汙的鳳凰，瘋狂嗜殺無法控制。投靠異域居於焚天之地，始祖已被蛄祖斬殺
墮落古僧：投靠異域的古僧一脈叛徒
蛇夜叉：異域王族，擁有人軀蛇頭夜叉翅及蛇尾
無殤一族： 帝族，為古祖無殤魔王一脈，祖術神通免疫，萬法不侵，法力免疫，古祖無殤已被荒鎮殺
</p>
</details>
點選展開內容。
但如果我們剛開啟網頁就想讓內容展開，
<details open="open">- Menu
- <menu> 命令列表（目前所有主流瀏覽器都不支援）
- <menuitem>menu命令列表標籤（只有FireFox8.0+ 支援）
- <command> menu標記定義一個命令按鈕（只有IE9支援）
- 其他標籤
- 註釋標籤
- <ruby> 標記定義註釋或音標
- <rt> 標記定義對ruby的註釋內容文字
<p>我們來 <ruby>跨<rt>kua</rt></ruby>一個話題</p>
解決相容性問題：
<p>我們來 <ruby>跨 <rp>(</rp><rt>kua</rt> <rp>)</rp></ruby>一個話題</p>如果相容kua就在字的上面，如果不相容就帶括號放在字的後面。
H5刪除標籤：
能用html完成的就儘量不用css。能用css完成的就儘量不用js。
- 純表現的元素：Basefont、big、center、font、s、strike、tt、u
- 對可用性產生負面影響的元素:frame、frameset、noframes
- 產生混淆的元素：acronym、applet、isindex、dir
重定義標籤：
顯示不變，只是表達的含義進行了重新定義的標籤。
- <b> 內聯文字，粗體
- <i> 內聯文字，斜體
- <dd> 可以同details與figure一同使用，定義包含文字，dialog也可用 描述
- <dt> 可以同details與figure一同使用，彙總細節，dialog也可用 標題
- <hr> 表示主題結束，而不是單單的水平線，雖然顯示相同。
- <menu> 重新定義使用者介面的選單，配合command或者menuitem使用。在之前html中有，到h4.01被w3c否掉。h5又再次定義。
- small 小字型。列印註釋或者法律條款。
- big刪除
- strong 表示重要性而不是強調符號