HTML 5 HTML 5 DOCTYPE HTML html head

简化的声明 HTML 5 <!DOCTYPE HTML> <html> <head> <title>Title of the document</title> </head> <body> The

更加语义化的结构 HTML 4 HTML 5 <div id=“header”> <header> <div id=“nav”> <nav> <div id=“article”> <div

更加语义化的结构 <body> <h 1>网页的标题</h 1> <article> <section> <header> <h 1>页头</h 1> </header> </section> <hgroup>

新的 form 属性 autocomplete – 自动完成 novalidate – 无需验证

新input type email url number range Date pickers (date, month, week, time, datetime, datetime-local)

新的 input 属性 autocomplete – 自动完成 autofocus – 自动获得焦点 form – 加入到某form中 form overrides

文件API File. List: <input type=“file”> Blob File. Reader URI scheme

html 5的拖拽API 被拖拽元素上的事件：dragstart、 dragend 目标元素上的事件：dragenter、 dragover、 dragleave、 drop 元素属性 draggable=“true” event. data. Transfer对象

本地存储 DOM Storage session. Storage local. Storage Web SQL Database

离线应用程序 Server 端设置 Add. Type text/cache-manifest appcache manifest文件更新缓存自动更新手动更新: window. application. Cache.

Web. Socket new Web. Socket('ws: //domain/path'); send(msg) onmessage, onerror, onopen, onclose Server：jetty 7/8, j.

资源 w 3 school. com. cn www. html 5 china. com http: //www. w

Slides: 23

Download presentation

简化的声明 HTML 5 <!DOCTYPE HTML> <html> <head> <title>Title of the document</title> </head> <body> The content of the document. . . </body> </html> HTML 4有三种声明：Strict、 Transitional 以及 Frameset <!DOCTYPE HTML PUBLIC "-//W 3 C//DTD HTML 4. 01//EN" " http: //www. w 3. org/TR/htm l 4/strict. dtd"> <html> … … </html>

更加语义化的结构 HTML 4 HTML 5 <div id=“header”> <header> <div id=“nav”> <nav> <div id=“article”> <div id=“section”> <div id=“footer”> <div id=“side Bar”> <article> <section> <footer> <aside>

更加语义化的结构 <body> <h 1>网页的标题</h 1> <article> <section> <header> <h 1>页头</h 1> </header> </section> <hgroup> <h 1>文章一级标题</h 1> <h 2>文章二级标题</h 2> </hgroup> <p>文章内容</p> </section> </article> </body>

新的 form 属性 autocomplete – 自动完成 novalidate – 无需验证

新input type email url number range Date pickers (date, month, week, time, datetime, datetime-local) search color tel

新的 input 属性 autocomplete – 自动完成 autofocus – 自动获得焦点 form – 加入到某form中 form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget) – 重写表单属性 height 和 width list – 关联datalist来限定输入值 min, max 和 step – 用在<input type=range>中 multiple - 规定输入域中可选择多个值 pattern (regexp) - 用于验证 input 域的模式（pattern） placeholder - 提示（hint），描述输入域所期待的值 required - 规定必须在提交之前填写输入域（不能为空）

文件API File. List: <input type=“file”> Blob File. Reader URI scheme

html 5的拖拽API 被拖拽元素上的事件：dragstart、 dragend 目标元素上的事件：dragenter、 dragover、 dragleave、 drop 元素属性 draggable=“true” event. data. Transfer对象