好久沒來更新博客了，今天又重新回來了。
這次要和大家分享的是H5的一些知識點。希望大家發現不足之處多多指教。
1.1 H5 推出的理由：
推出緣由和目標：
目前web存在一些問題，比如兼容性問題，同樣的頁面，在不同的瀏覽器上顯示的效果不一樣。
那麼開發人員需要做很多的額外工作解決問題，需要花費太多的時間。一些特殊的權限沒有
開放給開發人員，比如定位權限，拉起照相機拍照權限、動畫、繪畫。那麼H5推出就是爲了解決
這一系列的問題
H5解決了什麼問題：
1.開發了一些特殊的權限給開發者：有了這些權限，開發者可以輕易的獲取用戶的定位信息、拍照功能等等。
2.解決不同瀏覽器的兼容性問題：HTML5頁也可以理解爲一個協議標準，他讓絕大部分瀏覽器產商都遵守這一標準。
3.文檔結構不清晰：在之前的開發中，頁面的佈局都是使用DIV+CSS,不利於搜索引擎去抓取頁面信息，
比如：瀏覽器抓取一片新聞網頁的時候，根本抓不到作者，新聞發佈時間等信息。
h5之前我們的網頁絕大部分是div標籤嵌套，這樣對於SEO是很不利的，爲了解決這一問題，h5就新增了很多語義很強的
標籤，比如header、article、nav等等一系列標籤
既然是新版本，那麼各大主流瀏覽器的支持情況如何呢?
（1）Chrome，Firefox：支持html5很多年，而且有自動升級，支持最好。
（2）Safari，Opera：同樣支持html5很多年，支持也很好。
（3）IE：IE10起比較好了，之前很差。
1.2 語法的改變：
h5之前是很長的一串 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
h5就簡潔了很多：<!DOCTYPE HTML>
h5的聲明方式向下兼容（兼容所有的低版本）
1.3 字符集：
h5之前 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
h5 <meta charset="UTF-8">
默認的字符編碼就是 UTF-8
1.4 標籤標記省略：
<m可以省略全部：body、tbody、head、colgroup、html
不允許寫結束標記的標籤 Img input br、hr、base、link、meta
允許寫結束標記的標籤 p li dd dt td th
5.布爾類型的屬性
對於布爾類型的屬性，比如：readonly，disabled，checked、selected，當他們不寫值的時候，默認是true，同時對於值是任何東西都是無效的。只要寫了這個屬性，該屬性就生效。
6.屬性省略引號
在之前的學習中，屬性值都是放在雙（單）引號裏面的，在H5中，如果屬性值中不寶庫特殊字符，單雙引號都可以省略，
特殊字符：“（”“）”，‘=’
1.3新增和廢棄的元素新增和廢棄的屬性
新增的結構（佈局）標籤：section（章節）、article（文章），nav（導航）
footer、header、hrgroup、aside、figure
新增其他標籤：video、audio、mark（標記），time、menu、canvas、svg、
Details、datalist、progress、output、source ……
Input type的新增：email、url、number、date pickers，range
廢棄標籤：font center、tt、s、u、big、basefont
1.4全局屬性
在html5中定義了少量對所有元素都有效的屬性
1.Contenteditable = true：可以直接在頁面上進行編輯，編輯之後元素的寬高自動適應
Contenteditable = false 說明這個標籤不能被編輯。
注意:如果只設置了Contenteditable，其默認值是true
1.3新增和廢棄的元素新增和廢棄的屬性
新增的結構（佈局）標籤：section（章節）、article（文章），nav（導航）
footer、header、hrgroup、aside、figure
新增其他標籤：video、audio、mark（標記），time、menu、canvas、svg、
Details、datalist、progress、output、source ……
Input type的新增：email、url、number、date pickers，range
廢棄標籤：font center、tt、s、u、big、basefont
1.4全局屬性
在html5中定義了少量對所有元素都有效的屬性
1.Contenteditable = true：可以直接在頁面上進行編輯，編輯之後元素的寬高自動適應
Contenteditable = false 說明這個標籤不能被編輯。
注意:如果只設置了Contenteditable，其默認值是true
Display:none：看不見，不佔位置
4.Spellcheck
<input type="email" spellcheck="true"/>
<textarea spellcheck="true" cols="30" rows="10"></textarea>
Spellcheck屬性是html5專門爲input和textarea標籤提供新屬性，他的功能是對用戶輸入的內容進行拼寫和語法檢查，如果拼寫出錯，文字下方會出現波浪線。
Spellcheck = true：開啓語法和拼寫檢查。
Spellcheck = false：取消語法和拼寫檢查。
5.tabindex
<div>
<label>名字</label>
<input type="text" tabindex="1"/><div>
<div>
<label>身份證號碼</label>
<input type="text" tabindex="2"/>
</div>
<div>
<label>性別</label>
<input type="text" tabindex="4"/>
</div>
<div>
<label>年齡</label>
<input type="text" tabindex="5"/>
</div>
<div>
<button tabindex="4"></button>
</div>
<div><a href="http://www.huadianedu.com">華點軟件學院</a></div>
<div><a href="http://www.baidu.com">百度</a></div>
Tableindex=正整數：按鍵盤tab鍵可以選中（獲取焦點），這裏選擇的標籤可以是input輸入框、a標籤等等；同時，按table鍵選中的順序和設置的table屬性一致，tableindex越大，越後選中；tableindex=0不建議使用；tableindex=-1 按tab不選中。