code 标签仅用于语义标记行内技术名词，如函数名、命令、变量名；需保留格式时须配合 pre 使用并转义 HTML 字符。

code 标签本身不能格式化代码——它只负责语义标记，不保留换行、缩进或空格。真要让代码“看起来像代码”，必须配合 pre 使用，并手动转义 HTML 字符。

什么时候该用 code 单独包裹

只在句子中提一个短小的技术名词时用，比如函数名、命令、变量名：

• fetch() ✅ 行内出现，上下文明确，无换行需求
• os.path.join() ✅ 多点分隔但仍是单个调用表达式
• npm install ✅ 命令名，非脚本体
• userProfile ✅ 变量名，嵌在段落里自然
• 别把 if (x 塞进去 ❌ 含

展示多行代码必须用 precode 组合

pre 负责保留换行和空格，code 告诉浏览器“这是代码内容”——两者缺一不可：

HTML Text Extract

从HTML页面（URL、文件或标准输入）中提取主体内容文本，去除导航、页脚、广告和模板文本。可直接传递给readability_check或其他文本工具。

下载

• 正确写法：

  function greet(name) {
    return `Hello, ${name}!`;
  }

• 漏掉 pre：所有换行缩进被压成一行，语义丢失
• 漏掉 code：屏幕阅读器读作“预格式文本”，而非“源码”，辅助技术识别失败
• pre 默认可能横向溢出，建议加 CSS：overflow-x: auto + tab-size: 2

HTML 特殊字符不转义就会解析失败

只要内容里出现 、<code>>、&，就必须手动转义，否则浏览器当标签解析：

立即学习“前端免费学习笔记（深入）”；

• 想展示 <div class="box">，就得写成 <code><div class="box"> <li>比较表达式 <code>x 漏转义 → 后续 HTML 结构错乱甚至消失
• JSON 中的 "name": "&" 也要写成 "name": "&"
• 转义不是可选项，是硬性要求；工具如 Prism.js 或 highlight.js 也依赖这个前提

最容易被忽略的是：你写的那段“代码”，在放进 precode 之前，是否已被其他模板引擎（如 Jinja、Vue、PHP）提前解析过？一旦中间层先处理了 ，再塞进 HTML 容器就晚了——转义必须发生在最终输出到浏览器前的那一步。