该用samp而非code当展示程序运行后的输出结果，如终端回显“Compiled successfully”、错误信息“TypeError:…”或API返回体{"status":"ok"}；samp表语义为输出，code表代码本身，二者默认样式虽同但语义不可互换。
什么时候该用 samp 而不是 code
当你展示的是「程序跑完后吐出来的那串文字」，而不是「你写进去的那行代码」，就该用 samp。比如终端里执行 npm run dev 后打印的 Compiled successfully，这是输出，不是指令；而 console.log("done") 本身才是代码，得用 code 包裹。
常见混淆点：
- 把错误信息 TypeError: Cannot read property 'data' of undefined 写成
code—— 它是运行结果，不是你写的源码 - 把 API 返回的 JSON 字符串 {"status":"ok","count":3} 当作代码块渲染 —— 它是响应体，语义上属于输出
- 在文档里写「运行后你会看到：
404 Not Found」—— 这里404 Not Found应该是 404 Not Found，否则屏幕阅读器会误判为可执行逻辑
samp 和 code 的浏览器默认表现几乎一样，为什么还要区分
样式雷同不等于语义等价。浏览器默认都用等宽字体，但 samp 告诉辅助技术：「这是程序输出」；code 则说：「这是可执行的源文本」。SEO 工具、无障碍解析器、未来可能的语义化爬虫，都依赖这个区别做内容分类。
实际影响包括：
- 屏幕阅读器读
code可能逐字母拼读（如 “c-o-d-e”），而读 samp 会当作自然短语处理 - 某些静态站点生成器（如 Hugo、Jekyll）的微数据插件，会基于标签语义提取「示例输出」单独建索引
- 团队协作时，用错标签会让新人误以为那段文字是可复制粘贴执行的代码
多行输出怎么用 samp 正确包裹
samp 是行内元素，不能直接包换行内容。若输出含多行（比如命令行日志、堆栈），必须配合 pre 使用：pre 保格式，samp 定语义。
正确写法：
<pre class="brush:php;toolbar:false;"><samp>Error: ENOENT: no such file or directory, open 'config.json'
at Object.openSync (fs.js:498:3)
at readFileSync (fs.js:394:35)</samp>
错误写法：
- 只用
samp包含带换行的字符串 —— 换行会被浏览器忽略 - 用
code+pre替代 —— 语义错误，输出变成了“代码” - 把整个终端截图文字转成纯文本后全塞进一个
samp—— 缺少pre，缩进和空行丢失
哪些内容绝对不能塞进 samp
samp 只描述「程序或系统真实产生的输出」，不是所有等宽字体内容都适合它。
- HTML 示例代码块 —— 那是代码，该用
code或pre+code - 用户需要输入的命令，如
git commit -m "init"—— 属于用户动作，该用kbd或code - 变量名、函数签名，如
fetch()、userId —— 分别用code和 var - 你自己编的假输出，比如文档里写「假设你看到：Hello world!」但实际根本没这程序——语义失真，宁可用普通文本加引号
最易被忽略的一点：即使输出看起来像代码（比如 JSON、HTTP header），只要它是程序执行后的返回值，就归 samp 管；而它的解析逻辑、构造方式，才属于 code 的范畴。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
