HTML基础
HTML5 新增的语义化标签，正是为了优化文档结构而生。在 HTML5 之前，开发者通常用<div>标签划分页面区域，但<div>本身没有语义，只能通过class或id属性标注 “头部”“导航”“内容区” 等，既不直观，也不利于搜索引擎解析。而 HTML5 的<header>、<nav>、<main>、<article>、<section>、<footer>等标签，从名称上就能明确其功能：
<br>
<header>：定义页面的头部区域，通常包含网站 logo、标题、导航栏等，相当于页面的 “门面”。
<br>
<nav>：专门用于定义导航链接区域，比如网站的主导航菜单，让用户能快速跳转至其他页面。
<br>
<main>：表示页面的主要内容区域，一个页面中通常只有一个<main>，包含与页面主题直接相关的内容。
<br>
<article>：用于定义独立的、可复用的内容块，比如一篇博客文章、一条新闻报道，即使脱离当前页面，内容本身也完整可读。
<br>
<section>：用于划分页面中的 “节” 或 “段”，比如一篇文章中的不同章节，可包含标题和相关内容。
<br>
<footer>：定义页面的底部区域，通常包含版权信息、联系方式、备案号等。
<br>
用这些语义化标签搭建页面结构时，页面的逻辑会变得非常清晰。比如一个简单的博客页面结构可以这样写：
<br>
<!DOCTYPE html>
<br>
<html>
<br>
<head>
<br>
<meta charset="UTF-8">
<br>
<title>我的博客</title>
<br>
</head>
<br>
<body>
<br>
<header>
<br>
<h1>我的技术博客</h1>
<br>
<nav>
<br>
<a href="/home">首页</a>
<br>
<a href="/article">文章</a>