应只在句子中嵌入单个函数名、变量、命令或属性值时用 标签，如“调用 fetch() 时需传入 AbortSignal”；它为行内元素，不换行、不保留缩进与多余空格。

什么时候该用 标签而不是

只在句子中嵌入单个函数名、变量、命令或属性值时用 ，比如解释“调用 fetch() 时需传入 AbortSignal”。它天生是行内元素，不会换行，也不保留缩进和多余空格——浏览器会把连续空格、制表符、换行全压成一个空格。

常见错误是把多行逻辑塞进去：if (x ，结果渲染出来是 if (x ，所有格式丢失，语义也错（屏幕阅读器会当成一个长变量名读）。

• ✅ 正确场景：os.path.join()、npm install、user.id
• ❌ 错误场景：function hello() {\n return 'hi';\n}（含换行、缩进、HTML 特殊字符）
• ⚠️ 注意： 标签不自动转义 、&；写
  才能显示为

  ，漏掉就变成真实标签被解析

   标签默认样式靠不住，必须显式设置等宽字体

  虽然规范说 应该用等宽字体，但不同浏览器、系统、CSS 重置策略下表现不一。有些环境会 fallback 到 serif 字体，导致代码和普通文本看起来没区别。

  最稳妥的做法是在 CSS 中强制指定：

  

  HTML Text Extract

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

  下载

  code {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.875em;
    background-color: #f6f6f6;
    padding: 0.2em 0.4em;
    border-radius: 3px;
  }

  • 别只依赖浏览器默认行为，font-family 必须显式声明 monospace 或具体等宽字体栈
  • 加 background-color 和 padding 能快速区分代码与正文，但别设太强的对比度，避免视觉干扰
  • 避免用 white-space: pre-wrap——它会让长行在单词中间折断，破坏可读性；code 就该保持单行、不折行

  为什么不能用

  或 模拟

   是 HTML 原生语义标签，告诉浏览器“这是计算机可读的代码片段”。搜索引擎、语法高亮库（如 Prism.js）、屏幕阅读器都依赖这个标记做识别和处理。

  • 用 替代 ，Prism.js 不会自动高亮，因为没匹配到 元素
  • 屏幕阅读器可能读作“span 开始… span 结束”，而非“代码开始… 代码结束”
  • SEO 工具无法提取技术关键词（如 useState()），影响文档可发现性

  容易被忽略的细节：嵌套、转义与上下文一致性

  很多人只记得转义 和 >，却漏掉 &。比如想展示 href="https://a.com?x=1&y=2"，漏转义 & 会导致解析失败，甚至破坏后续 DOM。

  另一个坑是嵌套使用：不要在

  ，HTML 不允许  嵌套。如果需要强调某部分，用  或 CSS 类控制颜色即可。
  
  ✅ 正确：console.log('error')

  ❌ 错误：console.log('error')

  ⚠️ 多处出现同一代码片段时，确保转义方式一致（全部用 还是全部用 ），否则维护成本陡增

  真正难的不是写对一行 ，而是整篇文档里所有代码片段都保持语义准确、转义完整、样式统一——这点常被跳过，直到被辅助技术用户或 SEO 抓取工具反馈问题才意识到。