HTML5语义化标签 header 的详解
warning:
这篇文章距离上次修改已过190天,其中的内容可能已经有所变动。
HTML5引入了许多新的语义化标签,<header>
标签就是其中之一。<header>
标签用来表示网页或者一个区段的头部,通常包含网页的名称、logo、导航等头部信息。
下面是 <header>
标签的一个简单示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>示例网页</title>
</head>
<body>
<header>
<h1>示例网页</h1>
<nav>
<ul>
<li><a href="/">首页</a></li>
<li><a href="/about">关于我们</a></li>
</ul>
</nav>
</header>
<article>
<header>
<h2>文章标题</h2>
<p>发布时间:<time datetime="2023-04-01">2023年4月1日</time></p>
</header>
<p>这里是文章的内容...</p>
</article>
</body>
</html>
在这个例子中,第一个 <header>
标签用于定义网页头部,包括网页标题和导航链接。第二个 <header>
标签用于定义文章的头部,包括文章标题和发布时间。这样的语义化标签有助于搜索引擎理解网页内容的结构,同时也有助于增强网页的可访问性和可维护性。
评论已关闭