dfn标签仅用于标记术语首次出现且紧邻明确定义句时的术语本体，必须包裹术语词本身并紧邻定义语句，不可用于解释内容、重复标记或视觉强调；其语义核心是标识“定义点”，影响无障碍访问与结构化数据提取。
dfn 标签的正确语义用法
dfn 不是用来“加粗”或“高亮”术语的装饰性标签，它的核心作用是**标记文档中首次出现、且正在被定义的术语**。浏览器不会默认给它加样式，但屏幕阅读器会据此提供语义提示，搜索引擎也可能增强理解。误用（比如全篇每个术语都套 dfn）反而削弱语义。
实际写法很简单：
<p>在计算机科学中，<dfn>递归</dfn> 是指函数调用自身的过程。</p>
什么时候该用 dfn，什么时候不该用
该用的情况：
- 段落中第一次正式引入并解释一个术语，且解释紧随其后（比如“
dfn是 HTML 中用于标记定义的元素”） - 定义出现在
dt/dd结构中，且dt内容就是被定义项（这时dfn可省略，因dt本身已具定义语义）
不该用的情况：
- 术语重复出现（第二次及以后）——直接用普通
span或不包裹即可 - 仅作强调、无定义行为（如“这个概念很重要：
NP完全”） - 定义内容在别处（比如术语在标题里，解释在下一段）——此时应确保定义与
dfn在同一句或相邻句内
样式和可访问性注意事项
默认情况下 dfn 没有视觉样式，若需区分，建议用 CSS 显式设置：
dfn { font-style: italic; text-decoration: underline dotted; }
但要注意：
- 避免仅靠颜色区分（色觉障碍用户可能无法识别）
- 不要覆盖屏幕阅读器对
dfn的默认播报逻辑（比如强行用aria-label替换） - 如果定义很长，可以配合
title属性补充简短说明，但不可替代正文中的明确定义
常见错误：混淆 dfn 和 abbr
dfn 和 abbr 都涉及术语，但职责不同：
-
dfn表示“这里正在给出定义”，关注语义起点 -
abbr表示“这是缩写”，关注形式映射（如<abbr title="Cascading Style Sheets">CSS</abbr>） - 缩写首次出现时，如果同时给出全称解释，可用
dfn包裹全称，再用abbr包裹缩写，例如：<p>我们使用 <dfn>Cascading Style Sheets</dfn>（<abbr title="Cascading Style Sheets">CSS</abbr>）来控制页面样式。</p>
真正容易被忽略的是：定义必须“可感知”——不能藏在 JavaScript 生成的内容里，也不能依赖 hover 才显示；否则 dfn 就失去了语义锚点的意义。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
