html5中新增的元素和废除的元素

一、新增的结构元素

1、section元素表示页面中的一个内容区块，比如章节、页眉、页脚或页面中的其他部分。它可以与h1、h2、h3、h4、h5、h6等元素结合起来使用，标示文档结构。

h5中的代码事例：<section></section>

h4中的代码事例：<div></div>

2、article元素表示页面中的一块与上下文不相关的独立内容，譬如博客中的一篇文章或报纸中的一篇文章。

h5中的代码事例：<article><article>

h4中的代码事例：<div></div>

3、aside元素表示article元素的内容之外的、与article元素的内容相关的辅助辅助信息。

h5中的代码事例：<aside></aside>

h4中的代码事例：<div></div>

4、header元素表示页面中一个内容区块或整个页面的标题。

h5中的代码事例：<header></header>

h4中的代码事例：<div></div>

5、footer元素表示整个页面或页面中一个内容区域的脚注。一般来说，它会包含创作者的姓名、创作日期和创作者联系信息。

h5中的代码事例：<footer></footer>

h4中的代码事例：<div></div>

6、nav元素表示页面中导航链接的信息。

h5中的代码事例：<nav></nav>

h4中的代码事例：<ul></ul>

7、figure元素表示一段独立的流内容，一般表示文档主体流内容中的一个独立单元。使用figcaption元素为figure元素组添加标题。

h5中的代码事例：<figure>

<figcaption>这里是标题</figcaption>

<p>这里是内容</p>

</figure>

h4中的代码事例：<dl>

<h1>这里是标题</h1>

<p>这里是内容</p>

</dl>

8、main元素表示网页中的主要内容。主内容区域意指与网页标题或应用程序中本页面主要功能直接相关或进行扩展的内容。

h5中的代码事例：<main></main>

h4中的代码事例：<div></div>

二、新增的其他元素

1、video元素用于定义视频，比如电影中的片段或其他视频流。

h5中的代码事例：<video src="movie.ogg" controls="controls">video元素</video>

h4中的代码事例：<object type="video/ogg" data="movie.ogv">

<param name="src" value="movie.ogv">

</object>

2、audio元素用于定义音频，比如音乐或其他音频流。

h5中的代码事例：<audio src="someaudio.wav">audio元素</audio>

h4中的代码事例：<object type="application/ogg" data="someadio.wav">

<param name="src" value="someaudio.wav">

</object>

12、canvas元素表示图形，比如图表或其他图像。这个元素本身没有行为，仅提供一块画布，但把一个绘图API展现给客户端Javascript，以使脚本能够把想绘制的东西绘制到这块画布上。

h5中的代码事例：<canvas id="myCanvas" width="200" height="200"></canvas>

h4中的代码事例：<object data="inc/hdr.svg" type="image/svg+xml" width="200" height="200"></object>