samp标签的核心用途是表示程序输出的文本，属于语义化的行内元素，适合用来展示来自命令行、脚本或后台程序的原始结果。
通过正确使用samp，前端页面能够更清晰地区分“用户可编辑文本”与“程序输出文本”，从而提升可读性和可维护性。
1. samp 标签的基本概念
在 HTML 标准中，samp用于标记程序输出的样例文本，其语义明确指向“样本输出”，使屏幕阅读器能够区分它与普通文本的区别。
作为一个行内元素，samp通常与其他文本同在一行显示，且在多数浏览器中呈现为等宽字体，强调输出的原始性与不可预测性。
<p>命令输出示例：<samp>Hello, World!</samp></p>如果需要在样式上突出显示，可以把samp与 CSS 组合，例如设置等宽字体和对比色，以便读者快速识别程序输出。
samp { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: #2b8a3e; }2. samp 的常见用法场景
2.1 控制台输出的展示
在文档或应用的控制台输出区域，samp标签用来表示命令执行结果、错误信息或日志摘要，帮助用户区分系统信息与普通文本。
通过将实际输出包裹在 <samp> 中，可以让浏览器自动处理字体、大小和可选的前置样式，以保持一致的呈现。
<p>命令输出示例：<samp>ls -la</samp></p>2.2 文档与教程中的示例输出
在技术文档、教程和 API 说明中，samp可以帮助读者快速识别“示例输出”与“实际文本”的差异，提升可读性。
对于复杂的多行输出，可以配合 <pre> 标签使用，确保换行和空格得以保留。
<p>错误信息：<samp>Invalid input on line 3</samp></p>3. 与其他标记的对比与无障碍性注意事项
3.1 与 code、kbd、var 的对比
与 code、kbd、var 等标签相比，samp强调“输出样本”的语义，区别在于它专门用于表示程序产出的文本。
在无障碍性方面，屏幕阅读器通常会将 samp 读作“sample output”，帮助用户理解上下文的分隔。
<p>系统输出：<samp>Login successful</samp></p>3.2 可访问性与样式的结合
为了确保可访问性，应避免覆盖 samp 的语义而导致屏幕阅读器混乱，优先通过 CSS 调整视觉呈现而非改变结构。
可以结合 aria-live 或角色属性，来增强动态输出区域在无障碍环境中的表现。
<div role="region" aria-label="命令输出区域"><samp>完成</samp></div>