fetch() 是浏览器全局函数，用于发起http请求，返回promise；需用 .json() 或 .text() 解析响应体，且须手动检查 response.ok 判断http状态。
单行代码必须用 ，不能套 <pre class="brush:php;toolbar:false;">
教程里提到函数、变量或命令时， 是唯一语义正确的选择。比如写“调用 <code>fetch() 时传入 <code>AbortSignal”，浏览器会以等宽字体渲染，且不撑开段落行高。
-
fetch()✅ 正确：行内、语义清晰、屏幕阅读器读作“fetch 函数” -
fetch()
❌ 错误：是块级元素，自带 margin，塞进段落会打断行距、视觉断裂
- 漏转义
或 <code>>（如写x ）→ 浏览器尝试解析为标签，后续 HTML 可能错乱 - 别给
加 <code>white-space: pre：长命令会横向溢出，且基线对不齐
多行代码必须嵌套 ，二者缺一不可
函数体、配置片段、命令输出这类内容，只用
会塌成一行，缩进全丢；只用 <pre class="brush:php;toolbar:false;"> 则失去“这是代码”的语义，高亮库（如 Prism.js）无法识别语言，SEO 和读屏器也难理解。
- 正确结构：
<code>function greet(name) { return `Hello, ${name}!`; }</code>——保格式，<code> 定语义</code>
- 错误写法：
function greet(name) { return `Hello, ${name}!`; } → 渲染为单行，无缩进 - 错误写法：
function greet(name) { return `Hello, ${name}!`; }→ 搜索引擎当普通预格式文本，不索引为代码 - HTML 特殊字符必须手动转义：
、<code>>、&，哪怕只是写个比较表达式
样式和可访问性容易被忽略的硬性细节
没样式也能显示，但体验差。几个关键点：
必须设 <code>overflow-x: auto</code>，不然长代码行直接撑破容器
要设 <code>display: block，否则它作为行内元素，不响应的宽高和滚动控制
- 字体建议用
ui-monospace, 'SFMono-Regular', 'Consolas', monospace，比默认等宽更稳 - 别给
单独设 <code>white-space: pre：它已从继承，重复设置可能干扰层叠
- 缩进统一用空格（2 或 4 个），别用 Tab——不同环境渲染宽度不一致，容易错行
语法高亮不是 的职责，但结构必须配合
标签本身不解析语法，也不加颜色。所谓“高亮”，本质是给 <code>const、<code>"string"、// comment 这些 token 打上不同 class，再配 CSS。这一步必须由 Prism.js 或 highlight.js 完成，且只认
<pre class="brush:php;toolbar:false;"> 结构。
- 必须加
class="js"（或类似）在 <pre class="brush:php;toolbar:false;"> 标签上，高亮库才识得语言</pre> - 别在
上写 <code>class="brush:js;toolbar:false;"：那是旧版 SyntaxHighlighter 的写法，现代库不认 - 如果代码里含
<div class="box">，必须写成 <code><div class="box">，否则高亮库根本收不到完整字符串 真正容易被忽略的是混用边界：有人把整段 Shell 脚本塞进，有人把 <code>console.log()单独包一层。记住唯一判断标准——要不要保留原始换行和缩进。
