code 标签仅用于标记短小、内联、上下文清晰的技术名词；内容须手动转义 、& 等字符，否则会被浏览器错误解析。
code 标签不是“加个等宽字体”的装饰工具，它是有明确语义边界的 HTML 元素——只用于标记**短小、内联、上下文清晰的技术名词**，用错就会导致语义丢失、可访问性下降，甚至被浏览器错误解析。
什么时候该用 code，而不是
你只需要问自己一句：这段内容能不能自然嵌在一句话里，且不换行、不缩进？能，就用 code；不能，就得上
<pre class="brush:php;toolbar:false;">。
fetch() ✅ 函数调用，上下文明确，嵌在“调用 <code>fetch()获取数据”中毫无违和感-
os.path.join()✅ 模块+函数，仍是单个逻辑单元 -
npm install✅ 命令行指令，常见于文档说明句 -
userProfile✅ 变量名，语义明确 - if (x
<div class="header"></div> ❌ 含 ，未转义会直接被解析为标签，必须写成 <code><div class="header"></div>
code 内容必须手动转义的字符
code 是 HTML 元素，它的内容仍要经过 HTML 解析器。只要出现 、<code>>、&，就必须转义，否则结构会被破坏或渲染异常。
- 危险写法：
if (x 10)→ 浏览器看到就可能截断或报错 - 安全写法：
if (x 10) - CSS 属性如
display: flex不需要转义（没出现那三个字符） - JSON 片段
{"name": "Alice"}也不需转义；但一旦含&（比如 URL 参数），就得处理
为什么不能把多行代码硬塞进 code
code 是纯行内元素，规范明确禁止它保留换行、缩进、连续空格。你粘贴进去的所有回车和 tab，在渲染时都会被折叠成单个空格，屏幕阅读器也会把它当成一个“变量名”读出来，而非一段可执行逻辑。
- 错误效果：
function hello() { return 'Hi'; }渲染后变成 function hello() { return 'Hi'; }（全压一行，无缩进） - 正确做法：用
<pre class="brush:php;toolbar:false;"> 包裹，并对内部 HTML 字符转义：<pre class="brush:php;toolbar:false;"><code>function hello() {<br> return 'Hi';<br>}</code> - 注意：
负责保留格式，<code> 负责声明语义，二者缺一不可</code>
最容易被忽略的是转义习惯——很多人写 code 时只想着“看起来像代码”，却忘了它本质仍是 HTML 文本。哪怕只是写个 <code>React.memo()，只要上下文里混进了
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
