现代的浏览器都支持 HTML5。
此外，所有浏览器，包括旧的和最新的，对无法识别的元素会作为内联元素自动处理。
HTML5 定了 8 个新的 HTML 语义（semantic） 元素。所有这些元素都是 块级 元素。
为了能让旧版本的浏览器正确显示这些元素，你可以设置 CSS 的 display 属性值为 block:
// 实例
header, section, footer, aside, nav, main, article, figure { display: block; }
vanvas新元素
标签定义图形 比如图表和其他图像
<canvas id="myCanvas"></canvas>
<script type="text/javascript">
var canvas=document.getElementById('myCanvas');
var ctx=canvas.getContext('2d');
ctx.fillStyle='#FF0000';
ctx.fillRect(0,0,80,100);
</script>
新多媒体元素
| 元素 | 作用 |
|---|---|
| audio | 定义音频 |
| video | 定义视频 |
| source | 定义多媒体资源video和audio |
| embed | 定义迁入的内容 |
| track | 为诸如video和audio元素之类的媒介规定外部文本轨道 也就是字幕 字幕格式有.vtt格式 |
<!-- 音频 -->
<audio controls>
<source src="horse.ogg" >
<source src="horse.mp3" >
您的浏览器不支持 audio 元素。
</audio>
<!-- 视频 -->
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
您的浏览器不支持 video 标签。
</video>
<!-- track -->
<video controls width="320" height="240"
src="/video/php/friday.mp4">
<track default
kind="captions"
srclang="en"
src="/video/php/friday.vtt" />
抱歉，您的浏览器不支持嵌入视频！
</video>
语义化
HTML5 添加了很多语义元素如下所示：
| 元素 | 作用 |
|---|---|
| article | 定义页面独立的内容区域 |
| aside | 定义页面的侧边栏内容 |
| bdi | 允许你设置一段文本 失去脱离其父元素的文本方向设置 |
| command | 定义命令按钮 比如单选项按钮、复选框或者按钮 |
| details | 用于描述文档或文档某个部分的细节 |
| dialog | 定义对话框 比如提示框 |
| summary | 标签包含details元素的标题 |
| figure | 规定独立的流内容（图像、图表、照片、代码等 |
| figcaption | 定义<figure>元素的标题 |
| footer | 定义section和document的页脚 |
| header | 定义文档的头部区域 |
| mark | 定义带有记号的文本 |
| meter | 定义度量衡 仅用于已知最大和最小值的度量 |
| nav | 定义导航链接的部分 |
| progress | 定义任何类型的任务的进度 |
| rudy | 定义rudy注释 |
| rt | 定义字符 |
| rp | 在rudy注释中使用 定义不支持rudy元素的浏览器所显示的内容 |
| section | 定义文档中的节 |
| time | 定义日期或时间 |
| wbr | 规定在文本中何处适合添加换行符 |