small标签唯一合法用途是包裹法律/版权/注释类短语级内容,如版权年份、保留条款、许可证类型、表单字段限制说明,不得用于视觉缩放或独立成句。

small标签只用于法律/版权/注释类短语,不是缩放工具
直接说结论:small 的唯一合法用途,是包裹语义上属于“附属细则”的短语级内容——比如版权年份、保留条款、许可证类型、表单字段限制说明。它不控制视觉大小,浏览器默认缩小只是辅助传达“次要性”,不是设计本意。
常见错误现象包括:<small>温馨提示:本活动最终解释权归主办方所有</small> 单独放在页面顶部;或用 <small>删除</small> 包裹按钮文字。这两类都把 small 当成样式开关,结果是屏幕阅读器弱化播报、SEO 权重稀释、高对比度模式下文字可能不可见。
-
small内容必须是法律/版权/注释类文本 - 必须依附于主内容存在,不能独立成句或段落
- 本身不能构成独立陈述(例如不能单独作为页脚整句)
页脚版权中只能修饰附属部分,不能包整句
站点级主版权必须放在 <footer> 里,small 只能嵌套其中,用于弱化真正属于“附属说明”的成分,比如年份、All rights reserved.、MIT License 等惯例性附注。
正确写法示例:<footer><p>© <small>2024 XXX</small>. <small>All rights reserved.</small></p></footer>——这里两个 small 都是语义权重低的补充项,而 © 和主体公司名保持正常语义层级。
立即学习“前端免费学习笔记(深入)”;
禁止:<small>© 2024 XXX. All rights reserved.</small>(整句弱化,等于告诉辅助技术“这不重要”)
禁止:<small><p>一、定义</p></small>(small 是行内元素,不支持块级子元素)
表单与定义列表中用于字段级提示和限制说明
small 在交互场景中最自然的落点,是紧贴输入控件或定义项出现的短语级约束说明。这类内容必须存在、有法律或交互效力,但又不是主操作或主定义本身。
典型用法包括:<input type="password"><small>密码需包含大小写字母和数字</small>;或 <dl><dt>单人间</dt><dd>399 元 <small>含早餐,不含税</small></dd></dl>。
这些 small 内容会被读屏器朗读,但语调弱化,符合其“补充但不可省略”的定位。
注意:small 必须紧跟在关联元素之后(如 <input> 后、<dd> 内),不能隔开段落或容器;也不可用于替代 CSS 控制字号——想让某段文字变小,直接用 font-size + 语义正确的容器(如 <p class="fine-print">)。
small不能嵌套,也不能替代CSS做视觉控制
small 是纯语义标签,不负责视觉表现。它的默认缩小行为只是浏览器的辅助呈现,不应依赖它实现设计意图。
若需多段细则(比如用户协议里的多个小条款),外层用 <div> 或 <section>,内部各段用 <p>,再对其中短语加 small;不能把整个 <p> 包进 small。
容易被忽略的一点是:当 small 出现在高对比度模式或某些辅助技术中,其视觉弱化可能直接导致文字不可见——这不是 bug,而是语义误用的必然结果。真正需要“小字号+强语义”的地方,得靠 font-size + aria-label 或更精确的结构标记(如 <aside> + role="note")来协同表达。



















