samp标签仅用于标记程序真实生成、用户在终端中实际看到的原始输出文本，需同时满足来源真实、场景明确、角色为“输出”三条件；否则应选用code或pre。

samp 标签不是“让文本看起来像终端输出”的样式工具，它只在满足三个硬性条件时才该用：内容是程序真实生成的、用户真正在终端/控制台里看到的、上下文明确为“输出”——不达标就别硬套，否则语义错乱、辅助技术误读、SEO 反效果。

什么时候必须用 samp，而不是 code 或 pre

关键看内容来源和角色：

• samp 只包裹程序运行后“吐出来”的原始字符串，比如 ls -l 执行后终端里那一行 -rw-r--r-- 1 user staff 1024 Jan 1 12:34 index.html
• code 用于命令本身或代码字面量，比如 git commit -m "init" 或 fetch("/api")
• pre 是格式容器，负责保留换行缩进；samp 是语义容器，负责声明“这是输出”。二者常配合：<pre><samp>Traceback (most recent call last):</samp></pre>
• API 响应体（如 {"status":"ok"}）不属于终端输出，不该用 samp —— 它是数据载体，不是系统反馈文本

多行输出怎么写才不丢格式也不破语义

samp 是内联元素，自身不保留换行。直接写多行会塌成一行，但又不能靠多个 samp 拼接（语义断裂）：

• 正确做法：用 pre 包裹整个输出块，再把纯文本内容放进 samp —— <pre><samp>Error: ENOENT: no such file or directory, open 'config.json'</samp></pre>
• 错误做法：<samp>Error: ENOENT</samp><br><samp>no such file...</samp>（语义割裂，屏幕阅读器可能读成两条独立输出）
• 若需高亮某部分（如错误码 ENOENT），可在 samp 内嵌 strong 或 em，但禁止嵌套 div、p 等块级标签

为什么加了 samp 还是不像终端？样式要怎么补

浏览器默认只给 samp 设等宽字体，但真实终端还有背景色、边距、圆角、文字颜色等。这些必须靠 CSS 补齐，且建议写死字体栈：

• 基础样式建议：samp { font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; background-color: #f6f6f6; padding: 4px 6px; border-radius: 3px; }
• 不要只依赖 font-family: monospace —— 不同系统 fallback 差异大，SFMono-Regular（macOS）、Consolas（Windows）必须显式列出
• 避免用 white-space: pre-wrap 单独作用于 samp —— 它对内联元素支持不稳定；真正需要换行控制，请交给外层 pre
• 错误信息可用 samp.output-error 类 + 红色文字 + ❗图标，但状态含义必须由外层 div role="alert" 承担，samp 本身不表达成功/失败

最容易被忽略的一点：所有 samp 内容必须是真实截取或严格复现的输出，不能“大概意思差不多”。虚构输出会误导读者调试路径，也破坏 ARIA 层级中“可预测的响应”这一前提。