HTML5是HTML最新的修訂版本检疫。
HTML5 新特性
語(yǔ)義特性
HTML5賦予網(wǎng)頁(yè)更好的意義和結(jié)構(gòu)讶请。新增了一些語(yǔ)義化的標(biāo)簽，比如<header>屎媳、<footer>秽梅、<nav> 、<aside>等剿牺。
本地存儲(chǔ)特性
HTML5 新增了一些存儲(chǔ)功能企垦，localstorage等。
設(shè)備兼容特性
HTML5提供了前所未有的數(shù)據(jù)與應(yīng)用接入開(kāi)放接口晒来。使外部應(yīng)用可以直接與瀏覽器內(nèi)部的數(shù)據(jù)直接相連钞诡。
連接特性
更有效的連接工作效率，使得基于頁(yè)面的實(shí)時(shí)聊天湃崩，更快速的網(wǎng)頁(yè)游戲體驗(yàn)荧降，更優(yōu)化的在線交流得到了實(shí)現(xiàn)。HTML5擁有更有效的服務(wù)器推送技術(shù)攒读，Server-Sent Event和WebSockets就是其中的兩個(gè)特性朵诫，這兩個(gè)特性能夠幫助我們實(shí)現(xiàn)服務(wù)器將數(shù)據(jù)“推送”到客戶端的功能。
網(wǎng)頁(yè)多媒體特性
支持網(wǎng)頁(yè)端的Audio薄扁、Video等多媒體功能剪返， 與網(wǎng)站自帶的APPS，攝像頭邓梅，影音功能相得益彰脱盲。
基于SVG、Canvas日缨、WebGL及CSS3的3D功能钱反，用戶會(huì)驚嘆于在瀏覽器中，所呈現(xiàn)的驚人視覺(jué)效果匣距。
性能與集成特性
HTML5通過(guò)XMLHttpRequest2等技術(shù)面哥，解決以前的跨域等問(wèn)題，使Web應(yīng)用和網(wǎng)站在多樣化的環(huán)境中更快速的工作毅待。
常見(jiàn)的HTML5 新增標(biāo)簽
- 結(jié)構(gòu)類
| 標(biāo)簽 | 描述 |
|---|---|
<header> |
定義了文檔的頭部區(qū)域 |
<nav> |
導(dǎo)航 |
<footer> |
定義 section 或 document 的頁(yè)腳 |
<aside> |
定義頁(yè)面內(nèi)容之外的內(nèi)容 |
<article> |
定義頁(yè)面正文內(nèi)容 |
<section> |
定義文檔中的節(jié)（section尚卫、區(qū)段） |
<main> |
規(guī)定文檔的主要內(nèi)容 ，這部分內(nèi)容在文檔中應(yīng)當(dāng)是獨(dú)一無(wú)二的恩静，不包含任何在一系列文檔中重復(fù)的內(nèi)容 |
eg.
<header>
<nav></nav>
</header>
<section>
<aside></aside>
<aiticle></aiticle>
</section>
<footer></footer>
- 新表單元素
| 標(biāo)簽 | 描述 |
|---|---|
<datalist> |
定義選項(xiàng)列表焕毫。與 input 元素配合使用該元素（使用 input 元素的 list 屬性來(lái)綁定 datalist），來(lái)定義 input 可能的值 |
<keygen> |
規(guī)定用于表單的密鑰對(duì)生成器字段 |
<output> |
定義不同類型的輸出驶乾，比如腳本的輸出 |
- 多媒體
| 標(biāo)簽 | 描述 |
|---|---|
<video> |
定義視頻（video 或者 movie） |
<audio> |
定義音頻內(nèi)容 |
<canvas> |
標(biāo)簽定義圖形邑飒，比如圖表和其他圖像。該標(biāo)簽基于 JavaScript 的繪圖 API |
<source> |
定義多媒體資源 <video> 和<audio> |
<embed> |
定義嵌入的內(nèi)容级乐，比如插件 |
<track> |
為諸如 <video> 和 <audio> 元素之類的媒介規(guī)定外部文本軌道 |
input 新增類型
url
同上疙咸，格式不對(duì)時(shí)，會(huì)提示风科，相當(dāng)于做了一次正則驗(yàn)證撒轮。
number
只允許輸入數(shù)字，可以設(shè)定對(duì)所接受的數(shù)字的范圍贼穆，并且右側(cè)有加減按鈕题山。如果是在手機(jī)端打開(kāi)的話，彈出的是手機(jī)數(shù)字鍵盤故痊。
range
Date Picker
一般很少直接用顶瞳，因?yàn)闃邮娇赡懿环衔覀兊囊?.....
- Date
<input type="Date">
- month
<input type="month">
- week
<input type="week">
- time
<input type="time">
- datetime-local
