HTML5新增的一些特性

標籤：

HTML現在已經不是SGML的子集，主要是關於映像，位置，儲存，多任務等功能的增加。　　

　　.繪畫canvas；

　　.用於媒介回放的video：

　　　　Ogg是帶有Theora視頻編碼和Vorbis音頻編碼的檔案；

　　　　MPEG4是帶有H.264視頻編碼和AAC音頻編碼的MPEG4檔案；

　　　　WebM是VP8視頻編碼和Vorbis音頻編碼的檔案；

　　　　HTML5的規範沒有指定特定的視頻轉碼器，它留給了瀏覽器來決定。

　　　　Safari和IE9預期支援H.264格式的視頻，Firefox和Opera堅持開源的Theora和Vorbis格式，所以需要提供兩種格式。

　　　　Video支援三種視頻格式：Ogg，MPEG4，WebM。

　　.audio：

　　　　無需再依賴第三方產檢區渲染音頻了，因為HTML5提供了<audio>元素。

　　　　以MOozilla核心的Firefox瀏覽器只支援.ogg檔案，webkit核心的瀏覽器支援.mp3擴充，safari不承認.ogg,它會跳過並移到MP3版本。所以需要建立兩個版本的音頻。

　　　　Audio支援三種音頻格式：Ogg Vorbis，MP3，Wav。

　　.本地離線儲存localStorage長期儲存資料，瀏覽器關閉後資料不丟失；

　　.sessionStorage的資料在瀏覽器關閉後自動刪除；

　　.HTML5的本機存放區可以儲存5M大小的資料，甚至還多。它主要有四種：localStorage,sessionStorage,webSQL,indexDB；

　　.語意化更好的內容元素，比如 article、footer、header、nav、section；

　　.表單控制項，calendar、date、time、email、url、search；

　　.新的技術webworker、websocket、Geolocation；

移除的元素：

　　.純表現的元素：basefont，big，center，font，s，strike，tt，u；

　　.對可用性產生負面影響的元素：frame，frameset，noframes；

支援HTML5新標籤：

　　.IE8/IE7/IE6支援通過document.createElement方法產生的標籤，

　　.可以利用這一特性讓這些瀏覽器支援HTML5新標籤，

　　.瀏覽器支援新標籤後，還需要添加標籤預設的樣式。

　　

　　.當然也可以直接使用成熟的架構、比如html5shim；

　　<!--[if lt IE 9]>

　　　　<script>

　　　　　　src="http://html5shim.googlecode.com/svn/trunk/html5.js"

　　　　</script>

　　<![endif]-->

如何區分HTML5：

　　.DOCTYPE聲明\新增的結構元素、功能元素

　　.<mark>元素作為高亮。此標籤包裹的字串應該與使用者當前的行動相關聯。

　　.色彩坡形：

　　　　　　除了CSS 顏色，fillStyle和strokeStyle 屬性可以設定為CanvasGradient 對象。——通過 CanvasGradient可以為線條和填充使用色彩坡形。欲建立CanvasGradient對象，可以使用兩個方法：createLinearGradient和createRadialGradient。前者建立線性色彩坡形，後者建立圓形色彩坡形。建立色彩坡形對象後，可以使用對象的addColorStop方法添加顏色中間值。　　

　　.type=number的HTML表單元素是可以用按鍵的方式改變文字框中的值。

　　. type=range意為可以選擇某個值的地區範圍。

　　.type=data意為時間選取器控制項。

　　.type=color意為顏色選取器控制項。

　　.datalist是實現資料列表下拉效果的。

　　.<small>元素不再被用來建立靠近logo且相關的副標題。在html5中，<small>被重新定義，指小字。

　　.在表單輸入框應用程式名稱為”email”的type屬性可以命令瀏覽器只允許符合有效電子郵件地址結構的字串。但是較舊的瀏覽器不識別，它們會簡單的退回到普通文字框。

　　.預留位置：

　　　　　　placeholders意為文字框/文本域空間預設會有個文字提示，獲得焦點時，此提示文字就會消失；失去焦點時如果內容為空白，提示文字又出現。在表單控制項裡面顯示的提示性文字就是預留位置。

　　　　　　如果是以前需要一些javascript代碼實現預留位置的操作，而html5卻使得其非常輕鬆

　　.<mark>元素作為高亮。此標籤包裹的字串應該與使用者當前的行動相關聯。

 

HTML5新增的一些特性