是语义标签，专用于版权声明、免责声明、字段提示等次要但需保留的文本；仅当内容属“附属细则”时使用，不可用于纯视觉缩放。
<small></small> 不是用来“让文字变小”的样式开关，它是语义标签，专为免责声明、版权信息、法律条款、字段提示等附属但需保留的文本而设。
什么时候该用 <small></small>？
只在内容本身属于“次要但不可省略”的语义场景下使用：
- 页脚中的
© 2026 XXX 版权所有 - 表单输入框下方的提示：
<small>邮箱格式不正确</small> - 新闻正文末尾的信源标注：
<small>数据来源：国家气象局，2026年4月19日</small> - 产品页底部的法律声明：
<small>*本服务受《用户协议》及《隐私政策》约束</small>
这些不是“装饰性小字”，而是结构上必须存在、语义上从属主内容的文本。屏幕阅读器会朗读它，搜索引擎也会识别其低权重属性。
为什么不能用 <small></small> 控制按钮或标题里的小字？
常见错误是把 <small></small> 当成视觉工具：
-
<button><small>删除</small></button>—— “删除”是关键操作，不是旁注，语义错位 -
<h2>价格详情<small>（含税）</small> </h2>—— 标题结构被破坏，<small></small>不该嵌套进 heading -
<p><small>辅助说明</small></p>套两层没意义，<p></p>已是语义容器，直接加 CSS 类更干净
这类滥用会导致可访问性下降（如某些读屏软件弱化处理 <small></small> 内容）、SEO 权重误判，且在用户自定义样式（如高对比度模式）下可能完全失效。
想缩放文字？用 CSS，别依赖 <small></small>
浏览器对 <small></small> 的默认渲染只是参考值，实际字号由 UA stylesheet 决定，不同浏览器差异明显；而 CSS 可控、可复用、响应式友好：
- 推荐用
font-size: 0.875rem或font-size: 80%，单位选rem更尊重用户缩放设置 - 统一管理：定义
.fine-print { font-size: 0.875rem; color: #666; }，全站复用 - 避免嵌套
<small></small>实现“更小”——HTML5 规范不保证嵌套缩放效果，部分 UA 已忽略多层嵌套 - 不要混用：
<small style="font-size: 12px"></small>是双重冗余，语义 + 样式耦合，维护成本高
容易被忽略的兼容性与结构细节
<small></small> 支持所有全局属性（如 class、id、aria-label），但它本身不是块级容器，不能替代 <footer></footer> 或 <aside></aside>：
- 页脚版权行建议写成：
<footer><p><small>© 2026 XXX</small></p></footer>，而非仅靠<small></small> - 需要强调时，
<strong></strong>和<em></em>在<small></small>内依然有效，语义不被抵消 - 不要用
<font size="1"></font>替代——该标签 HTML5 已废弃，无语义、不可访问、无法继承
真正难的不是怎么写 <small></small>，而是每次敲下它之前，先问一句：这段文字，是不是真的属于“法律/版权/注释”类附属内容？如果不是，就该换 CSS。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
