一新增语义化标签(块级)
1.1标签(类似div)
- header(头部标签)
- nav(导航标签)
- main(主要标签)
- article(内容标签)
- section(块级标签)
- aside(侧边栏标签)
- footer(尾部标签)
1.2 details(详情的出现和隐藏)
<details>
<summary>标题</summary>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</details>
1.3 figure 定义独立的流内容(图像、图表、照片、代码等)
与div相同,用来包裹图片图表,有默认样式,如果被删除,也不会对文档流产生影响
<figure>
<img src="../img/ico3.png">
<figcaption>图片标题</figcaption>
</figure>
二新增语义化标签(行内)
2.1进度条(progress)
<progress value="30" max="40"></progress>
2.2度量衡(meter)
<meter value="61" max="100" min="1" low="20" high="70" optimum="80" ></meter>
三.增强型表单
3.1数据列表(datalist option)
模糊搜索
<input type="text" list="word">
<datalist id="word">
<option value="康师傅牛肉面"></option>
<option value="统一老坛酸菜"></option>
<option value="白象海鲜面"></option>
<option value="小当家方便面"></option>
</datalist>
3.2电子邮箱 (email)
对输入进行邮箱验证
3.3网址 (url)
对输入进行网址验证
3.4数字域 (number)
<input type="number" step="5" min="1" max="100">
每次跳5个数
3.5搜索域 (search)
3.6手机号码 (tel)
3.7滑动条 (range)
<input type="range" min="1" max="20" value="1" step="3">
step步长
3.8颜色 (color)
3.9年月日 (date),年月 (month),年周 (week),时间 (time)
四.新增input属性
4.1 readonly(只读)
4.2 disabled(禁用)
4.3 autofocus(输入框页面加载时,获得焦点)
4.4 required (是否必填)