# HTML 5

### 对 H5 的理解

H5 是对前端新技术的总称，包含了老生常谈的 HTML5、CSS3、ES6，以及其他各种帮助提升前端开发质量的开源技术。具有跨平台、更新快，免安装等优势。

### 目前哪些浏览器支持 HTML5

目前最新版本的主流浏览器都支持 HTML 5，包括 chrome、firefox、opera，IE 等，其中支持度最高的是 chrome 和 firefox。

### 知道哪些 HTML 标签

文本标签：div，p，span，br，hr，pre，「strong，b」粗体，「em，i」斜体，small 使用小一号字体

列表标签：ol，ul，li，「dl，dd，dt」术语列表

图像标签：img，figure，picture

链接标签：a，link，script，noscript

多媒体标签：video，audio，track，source，embed，object，param

iframe 标签

表格标签：table，caption 表格标题，thead，tbody，tfoot，col，colgroup，tr，th，td

表单标签：form，label，input，button，select，option，textarea，progress

### 知道哪些 HTML 5 新特性

#### 语义化标签

header，footer，nav，time，article，aside，mark，summary，details，section

HTML5 语义化标签预览：[https://codepen.io/yaozhibo/pen/mdVBOpJ](https://codepen.io/yaozhibo/pen/mdVBOpJ)

#### 新表单类型

* `<input type="email" />`:grinning: email 地址输入域
* `<input type="number" />`  数字输入域
* `<input type="url" />` URL 地址输入域
* `<input type="range" />` range 类型显示为滑动条，默认 value 值为 1 ～ 100 的限定范围，可以通过 min 和 max 来自定义范围
* `<input type="search" />` 用于搜索域
* `<input type="color" />`  用于定义颜色
* `<input type="tel" />` 用于电话号码
* `<input type="date" />` 时间选择器

#### HTML5 新增的表单属性

* `placehoder` 属性，简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示，在用户输入后消失。
* `required` 属性，是一个 boolean 属性。要求填写的输入域不能为空
* `pattern` 属性，描述了一个正则表达式用于验证`<input>` 元素的值。
* `min` 和 `max` 属性，设置元素最小值与最大值。
* `step` 属性，为输入域规定合法的数字间隔。
* `height` 和 `width` 属性，用于 image 类型的 `<input>` 标签的图像高度和宽度。
* `autofocus` 属性，是一个 boolean 属性。规定在页面加载时，域自动地获得焦点。
* `multiple` 属性 ，是一个 boolean 属性。规定`<input>` 元素中可选择多个值。
