samp 标签专指用户代理实际呈现的原始程序输出，如终端错误提示；不可用于 API 响应、日志或含解释性内容，须配合 CSS 实现等宽与换行，语义误用会损害可访问性。
<samp> 标签不是用来“表示程序输出”的通用解决方案，它专指**用户代理（如浏览器）实际显示的输出内容**，比如命令行回显、错误提示文本、终端打印结果——重点在“被呈现出来的原始响应”，而非开发者随意标注的任意输出。
为什么 <samp> 不能随便套用在 console.log 或后端日志上
它的语义是“sample output”，即**可被用户直接看到的、由软件生成的、未加解释的文本片段**。如果把一段模拟的 JSON 响应或伪代码结果包进 <samp>，反而会误导辅助技术（如屏幕阅读器）和搜索引擎。
- ✅ 正确场景：
bash$ ls -l /nonexistent后终端返回的ls: cannot access '/nonexistent': No such file or directory - ❌ 错误场景：
<samp>{ "status": "ok", "data": [] }</samp>—— 这属于 API 响应体，应使用<pre><code>组合 - ⚠️ 注意：它不自动换行、不保留空格，也不触发等宽字体——这些得靠 CSS 配合，比如
samp { font-family: var(--font-mono); white-space: pre-wrap; }
<samp> 和 <code>、<pre> 的分工边界
三者语义不同，混用会导致 HTML 验证失败或可访问性降级：
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
-
<code>：表示一小段计算机代码（如函数名、变量、HTML 标签名），例如document.getElementById() -
<pre>：仅表示“保留格式的文本块”，本身无语义，常作为<code>的容器 -
<samp>：必须是“运行结果”，且是**最终呈现给用户的字符串**，不能含解释性文字，也不能嵌套<code> - 典型组合：
<p>执行 <code>curl -I https://example.com</code> 后，得到如下响应头：</p><samp>HTTP/2 200<br>server: nginx</samp>
常见误用与修复建议
很多文档站点把调试日志、示例返回值全塞进 <samp>，这是对语义的弱化。遇到以下情况，请换方案：
立即学习“前端免费学习笔记（深入）”；
- 输出含 HTML 实体或需要语法高亮 → 改用
<pre><code class="json"> - 想强调“这是命令行输出”但内容是截图文字 → 用
<figure><figcaption>终端输出示例</figcaption><samp>...</samp></figure> - 服务端返回的 JSON/XML 示例 → 必须用
<pre><code>，并设aria-label="API 响应示例" - 浏览器控制台里
console.log('hello')打印出的hello→ 可以用<samp>hello</samp>，但前提是上下文明确这是“控制台实际回显”
真正难的是判断“这到底算不算 samp”。别看标签短，它对上下文依赖极强——同一段文本，在教程步骤里是 <samp>，在接口文档里就得是 <code>。语义写错，比样式写错更难被发现。
