必须用而非包裹行内技术名词；需转义html字符；配合、提升语义精度；避免混用块级高亮破坏语义。
直接用 <code> 标签包裹函数名、命令或变量，是开源项目文档里最轻量也最可靠的语义标记方式；它不渲染换行、不保留缩进，但能准确告诉浏览器“这是代码”，对 SEO、屏幕阅读器和语法高亮工具都友好。
什么时候必须用 <code> 而不是 <pre class="brush:php;toolbar:false;"><code></code></pre>
当你在段落中提一个具体的技术名词时，<code> 是唯一正确选择：
- 函数调用：
fetch()、useState()、git clone - 配置项名：
package.json、CONCURRENCY、__init__.py - 环境变量或 CLI 参数：
NODE_ENV=production、--watch - HTML 元素或属性：
<input>、aria-label、data-testid
误用 <pre class="brush:php;toolbar:false;"><code></code> 包裹这些内容，会导致强制换行、多余缩进、破坏行文节奏，还可能被 Prism.js 误判为完整代码块而触发错误高亮。</pre>
<code> 必须转义 HTML 字符才能安全显示
开源文档常要展示带尖括号的代码片段，比如 <div> 或 <code><script async></script>。如果直接写成 <code><div>，浏览器会解析标签并丢弃内容——你看到的可能是空白，或是 DOM 结构错乱。<p>正确做法是手动转义：</p><div class="aritcle_card flexRow artxards">
<div class="artcardd flexRow">
<a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf"><img
src="https://img.php.cn/upload/skill/000/000/081/178956546773641.jpg" alt="html-ppt-to-pdf" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
<div class="aritcle_card_info flexColumn">
<a rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf" class="overflowclass">html-ppt-to-pdf</a>
<p class="overflowclass">将使用 `<section class="slide">` 约定的 HTML 幻灯片转换为高保真、矢量文本 PDF（使用 Playwright + Chromium 原生 PDF 功能）。</p>
</div>
<a rel="nofollow" href="/xiazai/skill3458" title="html-ppt-to-pdf" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span>
</a>
</div>
</div>
<ul>
<li><code> → <code><
> → >
& → &
例如：<button type="submit">Save</button> 才能在页面上原样显示为 <button type="submit">Save</button>。
配合 <var></var> 和 <kbd></kbd> 提升语义精度
单一 <code> 不足以表达所有上下文。开源项目文档中高频出现三类内容，应分层标记：
- 用户输入操作：
<kbd>Ctrl+C</kbd>（表示键盘快捷键） - 可变占位符：
<var>PORT</var>（如npm start -- --port <var>PORT</var>） - 实际代码标识符：
<code>process.env.<var>PORT</var>（变量名嵌套在代码上下文中）
这样写，不仅让 CSS 可以分别样式化（比如 <kbd></kbd> 加边框阴影），也便于自动化工具提取命令、参数或环境依赖。
最容易被忽略的是：哪怕只写一个 console.log()，也要确保它在文档中是孤立的 <code>，而不是被塞进 <pre class="brush:php;toolbar:false;"></pre> 或用 class="js" 强行高亮——那属于多行块的处理逻辑，混用会破坏语义边界和可维护性。
