用于行内代码语义标记，用于多行代码，必须转义html特殊字符并配合高亮库使用。
直接用 <code> 标签展示代码，90% 的情况会出错——它只负责语义，不保留格式，也不转义 HTML 字符。
行内代码必须用 <code>，不能套 <pre class="brush:php;toolbar:false;"></pre>
在段落中提函数、变量或命令时，<code> 是唯一语义正确的选择。浏览器会以等宽字体渲染，且不影响行高和基线对齐。
-
fetch()✅ 正确：嵌入在<p></p>里，读屏器读作“fetch 函数” -
<pre class="brush:php;toolbar:false;"><code>fetch()</code></pre>❌ 错误：<pre class="brush:php;toolbar:false;"></pre>是块级元素，会撑开上下行距，破坏段落流 - 漏转义
或 <code>>（如写x ）→ 浏览器尝试解析为标签，后续 DOM 可能错乱 - 别给
<code>加white-space: pre：长命令会横向溢出，且与周围文本基线错位
多行代码必须用 <pre class="brush:php;toolbar:false;"><code></code> 嵌套结构</pre>
函数体、配置片段、命令输出这类内容，单用 <code> 会塌成一行，单用 <pre class="brush:php;toolbar:false;"></pre> 则丢失语义——搜索引擎和高亮库都认不出这是代码。
anything-to-html
下载
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
- 正确写法：
<pre class="brush:php;toolbar:false;"><code class="js">function hello() { console.log('hi'); }</code></pre>——<pre class="brush:php;toolbar:false;"></pre>保缩进换行，<code>定义语义 - 错误写法：
<code>function hello() { ... }→ 所有空格/换行被压缩，渲染为一长串 - 错误写法：
<pre class="brush:php;toolbar:false;">function hello() { ... }</pre>→ 没有<code>，高亮库（如 highlight.js）无法识别语言，SEO 不友好 -
<pre class="brush:php;toolbar:false;"></pre>默认可能横向溢出，建议加 CSS：overflow-x: auto和tab-size: 2
HTML 特殊字符必须手动转义，没有例外
只要代码里含 、<code>>、&，就必须转义，否则浏览器会当作标签解析，轻则内容消失，重则整个页面结构崩坏。
- 想展示
<div class="box">，必须写成 <code><div class="box"> - JS 字符串中的
"不用转义，但 HTML 属性值里的引号要匹配（推荐统一用"包裹属性） - 转义不是可选项：哪怕只是写个比较表达式
a c，也得全部转 - 可用工具辅助：VS Code 插件 “Auto Rename Tag” 不管用，得用 “Escape HTML Entities” 类插件，或手写脚本批量处理
- 必须引入 highlight.js 或 Prism.js，并调用
hljs.highlightAll()或Prism.highlightAll() - 高亮库只识别
<pre class="brush:php;toolbar:false;"><code class="html"></code> 这种结构，class 值决定语言（如 <code>language-js</code>、<code>language-css</code>）</pre> - 别试图用纯 CSS 给
<code>写伪高亮：无法区分 token 类型，维护成本高，可访问性差 - 服务端渲染场景下，仍需保持
<pre class="brush:php;toolbar:false;"><code></code> 结构，再由客户端补高亮，否则 SSR 后无法动态生效</pre>
语法高亮必须靠 JS 库，<code> 本身不带颜色
<code> 标签只做语义声明和基础等宽渲染，所有关键字、字符串、注释的着色，都依赖外部库解析并打 class。
最容易被忽略的是职责混淆：<pre class="brush:php;toolbar:false;"></pre> 管“怎么显示”，<code> 管“这是什么”。混用、漏嵌套、跳过转义，三者任一出问题，代码就既不好看，也不可靠。
