在 HTML5 中,引入了许多新的语义化元素,这些元素可以让我们更好地描述页面的结构和内容,提高网页的可读性和可访问性。在本章节中,我们将介绍一些常用的 HTML5 语义元素,并举例说明它们的用法。
<header>
<header>
元素用于定义页面或区块的头部,通常包含网站的标题、导航栏等内容。一个页面可以包含多个 <header>
元素。
示例代码:
-- -------------------- ---- ------- -------- ------------- ----- ---- ------ -------------------- ------ ---------------------- ------ ---------------------- ----- ------ ---------
<nav>
<nav>
元素用于定义页面的导航部分,包含一组导航链接。通常位于 <header>
或 <footer>
元素中。
示例代码:
<nav> <ul> <li><a href="#">首页</a></li> <li><a href="#">关于我们</a></li> <li><a href="#">联系我们</a></li> </ul> </nav>
<section>
<section>
元素用于定义页面的一个区块或部分,通常包含一个主题或内容。
示例代码:
<section> <h2>最新文章</h2> <article> <h3>文章标题</h3> <p>文章内容...</p> </article> </section>
<article>
<article>
元素用于定义页面的一个独立的文章内容,可以独立于页面的其他内容进行分发或重用。
示例代码:
<article> <h2>文章标题</h2> <p>文章内容...</p> </article>
以上是 HTML5 中一些常用的语义元素,通过合理地使用这些元素,可以让我们的网页更加结构化和易于理解。