【HTML5系列】第一章 · HTML5新增语义化标签
HTML5提供了一系列新的语义化标签,这些标签旨在明确表示其含义,有利于搜索引擎和开发者理解页面内容。以下是一些常用的HTML5新语义化标签的示例:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5 语义化标签示例</title>
</head>
<body>
<header>
<h1>我的网站标题</h1>
<nav>
<ul>
<li><a href="/">首页</a></li>
<li><a href="/about">关于</a></li>
<li><a href="/contact">联系</a></li>
</ul>
</nav>
</header>
<section>
<article>
<header>
<h2>文章标题</h2>
<time datetime="2023-01-01">2023年1月1日</time>
</header>
<p>这里是文章的内容...</p>
<footer>
<ul>
<li>标签1</li>
<li>标签2</li>
</ul>
</footer>
</article>
</section>
<aside>
<section>
<h3>侧边栏标题</h3>
<p>侧边栏内容...</p>
</section>
</aside>
<footer>
<p>版权信息</p>
</footer>
</body>
</html>
在这个示例中,我们使用了<header>
, <nav>
, <section>
, <article>
, <aside>
, <footer>
等标签来构建一个语义化的页面架构。这样的页面结构对于搜索引擎优化(SEO)和开发者理解页面内容都有很大帮助。
评论已关闭