标签的核心作用是语义化标注而非美化代码，它告诉机器“这部分内容是计算机源代码”，影响屏幕阅读器朗读、seo抓取和工具解析；需配合上下文明确语言类型与用途，不可替代格式控制或实现高亮。
标签的核心作用不是美化代码，而是告诉浏览器、搜索引擎和辅助技术：“这部分内容是计算机源代码”，属于语义化标注，而非样式容器。 <h3>它标记的是“什么”，不是“怎么显示”</h3> <p>浏览器默认用等宽字体渲染<code>，但这只是辅助识别；真正关键的是语义——让机器理解这段文字代表程序逻辑中的可执行成分。比如：</code></p>
fetch() 表示一个 JavaScript 函数调用，不是普通名词-
margin: 0 auto表示一条 CSS 声明，不是排版描述 -
npm install lodash表示终端命令，不是操作步骤说明
这种区分直接影响屏幕阅读器的朗读方式（会放慢语速、强调符号）、SEO 对技术内容的抓取，以及自动化工具（如代码提取器、文档生成器）的解析准确性。
必须配合上下文才完整表达含义
单独的
不说明语言类型、执行环境或用途，需靠周围文本或属性补全语义：
- 在段落中：调用
JSON.parse() 解析响应体—— 动词+共同构成动作语义
- 加 class 标识语言：
const x = 1; —— 为高亮和工具链提供依据 - 嵌套其他语义标签：
<var>username</var>.toLowerCase()—— 说明这是变量，说明这是调用语法
不能替代格式控制，也不等于高亮
本身不保留换行缩进，也不解析语法结构：
- 多行函数必须用
<code> 组合：<pre class="brush:php;toolbar:false;">管格式，<code>管语义</code>
- HTML 字符必须转义：
<div> 而非 <code><div>，否则会被解析成真实标签 <li>颜色、关键字高亮要靠 CSS 类或 JS 库实现，<pre class="brush:php;toolbar:false;">只提供基础语义锚点</pre> </li> <h3>误用会削弱可访问性与维护性</h3> <p>把 UI 文字、配置路径、算法描述塞进<code>，等于向机器发送错误信号：点击【提交】按钮 —— 这是用户操作，该用 <kbd> 或普通文本</kbd>-
server.conf 文件内容如下：—— 文件名可用，但全文应放在 <pre class="brush:php;toolbar:false;"><code> 中并标明 language-conf</code>
if (x > 0) { ... } 写在段落里却没说明这是伪代码还是实际运行逻辑 —— 缺失上下文，语义模糊
语义准确了，样式、高亮、复制、无障碍支持才能可靠落地。
