dfn标签仅在术语首次出现且紧邻明确定义语句时使用，必须包裹术语本身、置于语义化块级元素中，并按title属性>子元素title>自身文本的优先级提取定义内容。
dfn 标签不是加斜体的快捷键，也不是术语高亮工具——它只在术语**首次出现且紧邻明确定义语句**时才该用；用错等于向屏幕阅读器发送错误信号，SEO 和术语提取工具也会跳过它。
什么时候必须用 dfn？三个条件缺一不可
只有同时满足以下全部条件，才该包裹一个 dfn：
- 该词是整篇文档中第一次出现
- 紧随其后的文字（同一句子或紧邻段落）给出了它的明确定义，比如“是……”“指……”“表示……”，而非泛泛提及
- 这个词属于需澄清的专业概念，如
baseline、validator、URI，而不是通用词如button或click
常见错误：<p>详见 <dfn>HTTP</dfn> 协议。</p>——前面没定义，dfn 就成了无源之水。
dfn 里到底该放什么？术语提取有严格优先级
浏览器和辅助技术不读你看到的文本，而是按固定顺序提取“被定义的是什么”：
- 若有
title属性，则以该值为准：<dfn title="HyperText Markup Language">HTML</dfn>→ 定义的是 "HyperText Markup Language" - 若内部只有一个子元素（如
<abbr></abbr>）且该子元素有title，则取子元素的title - 否则，才取
dfn自身的文本内容：<dfn>querySelectorAll()</dfn>
⚠️ 注意：<dfn title="HTTP"></dfn> 是无效写法——内部为空，屏幕阅读器读不出可见词，违反可访问性底线。
父容器必须是语义化块级元素，不能随便套在 <div> 或 <code><td> 里<p><code>dfn 的定义上下文依赖祖先节点是否构成“可承载定义的环境”。规范明确要求最近的块级祖先应为 <p></p>、<section></section>、<dt></dt> 或 <figcaption></figcaption>：
- ❌ 错误：
<div>
<dfn>baseline</dfn> 是 CSS 中行内对齐的参考线。</div>——<div> 无定义语义，<code>dfn 断连
- ❌ 错误：
<td><dfn>viewport</dfn></td>——表格单元格不是定义容器
- ✅ 正确：
<p><dfn>DOM</dfn> 是文档对象模型的缩写，表示 HTML 文档的编程接口。</p>
最容易被忽略的一点：你写的 dfn 是否真正在文档中「首次出现」？
如果同一术语已在前文某处定义过（哪怕没套 dfn），这次再用就属于滥用——语义污染比不用更糟。比如开头已写过“API 是应用程序接口”，后面再出现 <dfn>API</dfn>，屏幕阅读器会误判为“重新定义”，破坏上下文连贯性。真正难判断的，从来不是怎么写，而是怎么确认它确实是第一次。
<div>
<dfn>baseline</dfn> 是 CSS 中行内对齐的参考线。</div>——<div> 无定义语义，<code>dfn 断连
<td><dfn>viewport</dfn></td>——表格单元格不是定义容器<p><dfn>DOM</dfn> 是文档对象模型的缩写，表示 HTML 文档的编程接口。</p>
最容易被忽略的一点：你写的 dfn 是否真正在文档中「首次出现」？
如果同一术语已在前文某处定义过（哪怕没套 dfn），这次再用就属于滥用——语义污染比不用更糟。比如开头已写过“API 是应用程序接口”，后面再出现 <dfn>API</dfn>，屏幕阅读器会误判为“重新定义”，破坏上下文连贯性。真正难判断的，从来不是怎么写，而是怎么确认它确实是第一次。
