必须且仅出现一次，代表页面主标题；–逐级嵌套体现内容从属关系；用于段落，不可用模拟换行；是语义化主题分隔符，仅用于需人工换行的场景。
用 <p></p> 和 <h1></h1>–<h6></h6> 搭建语义化骨架
排版不是堆砌标签，而是用语义表达内容层级。<h1></h1> 必须且只能出现一次，代表页面主标题；<h2></h2>–<h6></h6> 逐级嵌套，反映内容从属关系。段落必须用 <p></p>，不能靠多个 <br> 模拟换行——后者破坏语义、影响可访问性和 SEO。
-
<h1></h1>内容应与<title></title>高度一致，搜索引擎和屏幕阅读器都依赖它 - 避免跳级使用，比如
<h2></h2>后直接写<h4></h4>，会打乱大纲结构 -
<p></p>自带上下外边距（margin），若需紧凑排版，后续要用 CSS 重置，而不是删掉标签
用 <hr> 和 <br> 区分视觉节奏，但别混淆用途
<hr> 是语义化的「主题分隔符」，表示内容逻辑断点（如章节切换）；<br> 是纯视觉换行，仅用于诗歌、地址等需要保留人工换行的场景。两者不可互换。
- 在新闻稿中，用
<hr>分隔导语、正文、作者信息三块，比加空<p> </p>更规范 -
<br>是单标签，不闭合，写成<br>虽然 HTML5 允许，但没必要，徒增冗余 - 用 CSS 的
margin或padding控制间距，比滥用<br>更可控、更可维护
用 <div> 和 <code><span></span> 划分区块与内联范围
<div> 是无语义的块级容器，用于组织大块内容区域（如页眉、侧栏、文章主体）；<code><span></span> 是无语义的行内容器，只在需要局部样式或 JS 操作时包裹文字片段。
- 不要为了加粗而用
<div><strong>文本</strong></div>——<div> 本身不传递任何含义，纯属冗余<li>避免嵌套过深：<code><div><div><div><p>...</p></div></div></div>这类结构会让 CSS 选择器失控 - 现代开发中，优先考虑语义化替代方案：用
<header></header>替<div class="header">，用 <code><article></article>替<div class="post"> <h3>注释和对齐属性已过时，别再用 <code>align或<font></font>align属性（如<p align="center"></p>）和<font></font>标签在 HTML5 中已被废弃。浏览器虽仍支持，但它们把表现层逻辑硬编码进 HTML，违背结构与样式的分离原则。- 居中标题用 CSS：
<h2 style="text-align: center"></h2>或更推荐类名 + 外部样式表 -
<font color="#333"></font>必须替换成style="color: #333"或 CSS 类，否则无法通过现代校验工具 - HTML 注释
<!-- -->只能用于说明或临时屏蔽代码，不能嵌套，也不能出现在<script></script>或<style></style>内部
实际排版效果取决于 CSS，HTML 标签只负责定义“这是什么”，不是“长什么样”。很多人卡在视觉还原上，其实是混淆了职责边界——把
<p></p>当作换行工具、把<div> 当作万能盒子，最终导致结构松散、样式难以复用。</div> - 居中标题用 CSS：
