HTML5

html5

html51.HTML5由W3C和WHAT组织机构共同研发出来的，于2014年正式发布。2.HTML5成为了新一代网页开发标准。3.HTML5新特性（面试）4.网页布局标签5.语义化标签6.HTML5多媒体7.HTML5常用属性8.表单组件9.表单属性10.input属性

1.HTML5由W3C和WHAT组织机构共同研发出来的，于2014年正式发布。

2.HTML5成为了新一代网页开发标准。

3.HTML5新特性（面试）

1）增加了audio和video音频播放，抛弃了Flash ​ 2）新增了canvas画布（绘画，制作动画（如小游戏开发等）） ​ 3）地理定位 ​ 4）增加了离线缓存 ​ 5）硬件加速 ​ 6）Web Socket（全双工通信） ​ 7）增加了本地存储 ​ 8）新增了一些语义化标签

4.网页布局标签

header:页首 ​ nav:导航栏 ​ aside:侧边栏 ​ main:主体 ​ section:区块 ​ article:文章 ​ footer:页尾

5.语义化标签

1)mark:高亮显示(行级) ​ 2)details(描述)与summary(摘要):一般用于名词解释或用于封装一个区块等 ​ 3)meter:定义度量衡 ​ 属性:value/min/max ​ 4)progress:进度条 ​ 属性:value/min/max ​ 5)dialog:对话框或窗口 ​ 6)figure:用于对元素进行组合（一般用来组合一张图的标题、图片和图片描述等）

6.HTML5多媒体

1)audio ​ 播放音乐或音频。IE9以下的版本不支持。

a)支持的格式 ​ .mp3/.ogg/.wav ​ b)属性 ​ src:文件路径 ​ autoplay:自动播放 ​ loop:循环 ​ controls:控制条 ​ muted:静音 ​ preload:预加载（当使用autoplay时，preload自动失效） 2)video ​ 加载视频。IE9以下的版本不支持。

a)支持的格式 ​ .mp4/.ogg/.webm ​ b)属性 ​ src:文件路径 ​ autoplay:自动播放 ​ loop:循环 ​ controls:控制条 ​ muted:静音 ​ preload:预加载（当使用autoplay时，preload自动失效） ​ width:宽度 ​ height:高度 ​ poster:海报 3)embed ​ 嵌入内容或加载插件。

属性: ​ src:文件路径 ​ width:宽度 ​ height:高度 ​ type:类型 4)canvas ​ 画布。是一个容器元素。 ​ 注意： ​ a.单独使用canvas没有什么意义，它必须结合Javascript使用。它的具体功能体现是通过 ​ Javascript体现现来的。 ​ b.canvas的宽高最好不要通过css实现，而是直接使用标签属性width和height实现。

7.HTML5常用属性

1）contentEditable ​ 将标签转换为可编辑状态。可用于所有标签。它的值有true/false。 ​ 2）hidden ​ 对元素进行隐藏。一般用来传值或当某个条件成立，执行内容显示。默认值为hidden。 ​ 3）data-* ​ 用于存储页面或应用程序的私有自定义数据。一般用于传值。 ​ 4）multiple ​ 规定输入域中可选择多个内容。用于表单组件中，如file/select。 ​ 5）required ​ 约束表单元互在提交前必须输入值。用于表单组件中，需要结合提交按钮使用。 ​ 6）pattern ​ 用于验证输入字段的模式。用于表单组件中，需要结合提交按钮使用。

8.表单组件

1）color：颜色 ​ 2）email：邮箱 ​ 3）tel：电话号码 ​ 4）url：网址 ​ 5）number：数字 ​ 6）range：范围 ​ 7）search：搜索 ​ 8）date：日期 ​ 9）datetime：日期时间 ​ 10）datetime-local：本一日期时间 ​ 11）year：年份 ​ 12）month：月份 ​ 13）time：时间

9.表单属性

1）formaction:修改action数据提交的地方 ​ 2）formenctype:修改表单请求的类型 ​ 3）formmethod:修改数据提交的方法（默认get）

• get是以字节为单位提交只接受ASCII码，post是以字符为单位提交

• get以明文提交，一般不传输敏感数据，因为传输数据暴露了，post暗文

• get在浏览器中回退是无害的，post会再次提交请求

• get会被浏览器主动缓存，而post不会，除非手动设置

• get和post在传输字节数上一般没有限制，个别浏览器会有。可以理解为get一般不超过2K，post一般不超过2M

4）form:设置表单元素属于哪个表单 ​ 5）novalidate:不验证

10.input属性

1）autocomplete:自动完成 ​ 用来帮助用户输入，每一次输入的内容，浏览器是否保存输入的值，以备将来使用。值有： ​ on/off，默认为on。 ​ 为了保护敏感数据（如用户帐号、密码等），避免本地浏览器对它们不安全存储，一般需要关闭。 ​ 2）autofocus:自动获焦 ​ 3）step:步长 ​ 4）multiple:多选 ​ 5）pattern:正则匹配 ​ 6）placeholder:输入提示 ​ 7）required:必须输入