标签专用于标记术语首次定义的位置，仅包裹被定义的术语本身，不可用于缩写展开或整句定义；title 属性可选但非必需，语义优先于视觉样式，对无障碍和seo至关重要。
<dfn></dfn> 标签不是“加粗”或“高亮”的视觉装饰工具，它的核心作用是明确标记某个术语在文档中**首次被定义的位置**——浏览器、屏幕阅读器和搜索引擎靠它理解语义，而不是靠你手动加个 title 或 CSS 类。
什么时候必须用 <dfn></dfn>？
仅当你要声明一个术语的首次定义时才用。比如文档开头解释“响应式设计”这个概念：
<p>我们采用<dfn>响应式设计</dfn>：一种网页布局方法，能根据设备视口自动调整呈现方式。</p>
后续再次提到“响应式设计”，就不再套 <dfn></dfn> ——否则语义错误，相当于反复“首次定义”。
- 不能用于缩写词展开（如
<abbr title="Cascading Style Sheets">CSS</abbr>才是正确选择） - 不能包裹整个定义句，只包裹被定义的术语本身（即“响应式设计”，不包括冒号或解释部分）
- 如果定义分散在多句话中，
<dfn></dfn>仍只出现在术语第一次出现处，哪怕那句话没带解释
<dfn></dfn> 的 title 属性要不要加？
可以加，但不是必须；加了也不影响语义，只是给用户提供额外提示。常见误区是以为 title 是定义内容本身：
<dfn title="一种通过媒体查询适配不同视口的布局策略">响应式设计</dfn>
这没问题，但注意：
-
title是辅助信息，不是替代正文定义；屏幕阅读器通常优先读正文句子，而非title - 如果定义已在正文中清晰写出，
title纯属冗余，还可能和正文重复导致朗读啰嗦 - 不要把整段定义塞进
title——它会被截断，且无法被搜索引擎有效索引
和 <em></em>、<strong></strong> 混用会怎样？
可以嵌套，但必须服从语义优先级：<dfn></dfn> 描述“这是术语首次定义”，<em></em> 表示强调，<strong></strong> 表示强重要性。三者目的不同，混用没问题，但顺序和意图要合理：
<p>我们引入<dfn><em>零信任架构</em></dfn>：默认不信任任何网络位置。</p>
这里 <em></em> 强调术语本身（适合演讲场景），而 <dfn></dfn> 锁定其定义地位。但反过来写成 <em><dfn>...</dfn></em> 逻辑上也成立——只是强调对象变成了“定义行为”，容易歧义。
- 避免套
<strong></strong>：除非该术语定义本身具有强制性（如规范文档中的关键词），否则<strong></strong>会干扰“定义”这一语义焦点 - CSS 可以重置默认斜体样式，但别因此放弃
<dfn></dfn>——视觉不重要，机器可读性才关键
真正容易被忽略的是：很多开发者只在写技术文档时想到 <dfn></dfn>，却忘了产品说明、API 文档甚至内部 Wiki 里，每个新概念首次出现都值得标记。它不改变页面外观，但一旦缺失，对无障碍访问和语义化 SEO 就是实打实的损失。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
