HTML5中的新特性

通过这篇文章，学习HTML5新增了哪些新特性及使用方法。

语义化标签

<header> 定义 section 或 page 的页眉
<footer> 定义 section 或 page 的页脚
<section> 定义 section
<article> 定义文章
<aside> 定义页面内容之外的内容
<nav> 定义导航链接
<canvas> 定义图形
<audio> 定义声音
<video> 定义视频
<source> 定义媒介源
<details> 定义元素的细节

<summary> 为 details 元素定义可见的标题

这里是标题

明细1
明细2

<details>
  <summary>这里是标题</summary>
  <ul>
    <li>明细1</li>
    <li>明细2</li>
  </ul>
</details>

<figcaption> 定义 figure 元素的标题

<figure> 定义媒介内容的分组，以及它们的标题

Blog头像

<figure style="margin:0;">
  <img src="https://blog.maxmeng.top/images/avatar.jpg" width="350" height="234" />
  <figcaption>Blog头像</figcaption>
</figure>

<mark> 定义有记号的文本
自带黄色背景的mark标签
1
<mark>自带黄色背景的mark标签</mark>

<meter> 定义预定义范围内的度量
十分之三

1	<meter value="3" min="0" max="10">十分之三</meter>

<progress> 定义任何类型的任务的进度

1	<progress value="22" max="100"></progress>

<time> 定义日期/时间

我们在每天早上 9:00 开始工作
1
<p>我们在每天早上 <time>9:00</time> 开始工作</p>
表单增强
input新增的type类型
number 数字
url 网址
email 邮箱
color 颜色选择框
date 日期选择框（yyyy-mm-dd）
time 时间选择框（hh:mm）
range 滑块
search 搜索
week 周
month 月

新属性

autocomplete 是否保存用户输入值默认为on，关闭提示选择off
autofocus 自动获取焦点
required 必填项目
pattern 正则验证 pattern=”\d{1,5}”
placeholder 输入框提示信息

语义化标签

表单增强

input新增的type类型

新属性