dfn 标签仅用于首次正式定义术语时包裹该术语本身，必须置于语义化块级元素内、紧接自然语言解释，且优先通过 title 属性提供准确定义；误用会破坏语义与可访问性。
dfn 标签不是用来“修饰”定义词的，它只在术语**首次被正式定义**时标记该术语本身；用错位置、套在已知词上、或仅当样式工具用，都会破坏语义和可访问性。
dfn 必须包裹被定义的词，不能包裹整句解释
常见错误是把整个定义塞进 dfn 里，比如 <dfn>HTML 是超文本标记语言</dfn>——这会让屏幕阅读器误以为“HTML 是超文本标记语言”这个词组才是被定义项，语义完全错位。
正确做法是只包术语本体，并确保后紧跟自然语言解释：
<p><dfn title="HyperText Markup Language">HTML</dfn> 是一种用于创建网页结构的标记语言。</p>- 若不用
title，则必须保证术语出现在定义句开头，且句子完整通顺：<p><dfn>DOM</dfn> 是文档对象模型（Document Object Model）的缩写。</p> - 删掉
dfn标签后，原句仍应是语法正确、语义清晰的定义句
title 属性决定“被定义的是什么”，不是可选项
浏览器和读屏软件提取术语时，严格按优先级：先看 title 值，再看子元素（如 abbr）的 title，最后才取 dfn 内部文本。一旦 title 存在，哪怕为空或重复术语，就不再回退。
容易踩的坑：
-
<dfn title="HTML">HTML</dfn>→ 实际定义的是字符串 "HTML"，没提供新信息，等于白写 -
<dfn title="">CSS</dfn>→ 定义内容为空，辅助技术可能跳过或报错 -
<dfn title="层叠样式表">CSS</dfn>→ 正确：title提供准确全称，内部保留常用缩写
父容器必须是语义化块级元素，否则 dfn 断连
dfn 的定义上下文依赖其祖先是否构成合法承载环境。规范只认可 <p></p>、<section></section>、<dt></dt>、<figcaption></figcaption> 这类有定义语义的块级元素。
这些写法无效：
-
<div> <dfn>baseline</dfn> 是 CSS 行内对齐参考线。</div>——<div> 无定义语义，<code>dfn失去上下文 -
<td><dfn>URI</dfn></td>—— 表格单元格不支持定义行为 -
<h2><dfn>Accessibility</dfn></h2>—— 标题不是定义发生的位置
真正起作用的，是 <p><dfn>validator</dfn> 是用于检查 HTML 文档是否符合标准的工具。</p>
别把 dfn 当斜体开关，视觉和语义不能混为一谈
多数浏览器默认给 dfn 加 font-style: italic，但这只是渲染副作用。如果你只是想让某个词斜体，用 <em></em> 或 CSS 更直接；如果目标是让读屏软件识别“这是首次定义”，那必须满足全部语义条件——哪怕你重置了斜体样式，dfn 的 ARIA 角色（role="definition"）依然生效。
最容易被忽略的一点：很多人在段落中间突然插一个孤立的 <dfn>fetch()</dfn>，前后没有任何解释，还自以为“已经标过了”。这种写法既不被搜索引擎索引，也逃不过辅助技术的校验逻辑——它根本不会被当作定义处理。
