其他新标签

HTML5 相较于之前版本,新增了许多语义化标签,帮助开发者更清晰地表达网页结构和内容,提高网页的可访问性和搜索引擎优化效果。

主要新标签介绍

1. <article>

表示页面中独立的内容块,如博客文章、新闻条目。

<article>
  <h2>文章标题</h2>
  <p>文章内容...</p>
</article>

2. <section>

定义文档中的章节或区域,通常包含标题。

<section>
  <h2>章节标题</h2>
  <p>章节内容...</p>
</section>

3. <aside>

表示与主内容稍有关系的侧边内容,如侧边栏、广告或引用。

<aside>
  <p>侧边栏内容</p>
</aside>

4. <figure><figcaption>

用于标注图像、插图及其说明文字。

<figure>
  <img src="image.jpg" alt="示例图片" />
  <figcaption>图片说明文字</figcaption>
</figure>

5. <header><footer>

分别表示页面或区块的头部和底部区域。

<header>
  <h1>网站标题</h1>
</header>

<footer>
  <p>版权信息</p>
</footer>

6. <main>

定义页面的主体内容,页面中只能有一个 <main> 标签。

<main>
  <p>主要内容</p>
</main>

7. <nav>

表示导航菜单区域。

<nav>
  <ul>
    <li><a href="#">首页</a></li>
    <li><a href="#">关于</a></li>
  </ul>
</nav>

小结

HTML5 新增的这些标签丰富了网页的语义层次,方便开发者构建结构清晰、易维护且对搜索引擎友好的网页,建议在开发中积极使用。