dd标签的语义职责是定义列表中包裹术语解释内容的专用元素，必须紧随dt之后，不可替代p或div，其嵌套结构对可访问性至关重要。
什么是 dd 标签的语义职责
dd（definition description）是定义列表 dl 中用于包裹术语解释或详情内容的标签，必须紧跟在 dt（definition term）之后。它不是通用容器，不能替代 p 或 div；浏览器和读屏器依赖它的嵌套结构识别「术语-释义」关系。
常见误用：把整段说明文字直接塞进 dl 而不配对 dt，或用多个 dd 对应一个 dt 却没加 aria-labelledby 辅助关联——这会让语义断裂，影响可访问性。
如何正确嵌套 dt 和 dd 展示术语详情
一个术语可对应一个或多个 dd，但每个 dd 必须有明确归属。多释义场景下，推荐用单个 dt + 多个连续 dd，而非拆成多个 dl 块。
-
dt内容应简洁、无标点结尾（如<dt>API</dt>，不是<dt>API：</dt>） -
dd可包含行内元素、p、ul甚至短代码块（pre），但避免嵌套dl - 若术语需强调层级（如「状态码 404」下再分「含义」「常见原因」「修复建议」），优先用
h4+p在dd内组织，而非强行新增dt
- HTTP 状态码
- 服务器响应请求时返回的三位数字代码，用于表示处理结果类别。
- 404
- 客户端请求的资源在服务器上未找到。
- 常见原因包括 URL 拼写错误、页面被删除、路由配置缺失。
样式控制与常见兼容性陷阱
默认情况下，dd 有左侧外边距（margin-left: 40px），且部分旧版 Safari 对 dd 内 display: flex 支持不稳定。重置样式时，别只清 margin，也检查 padding 和 line-height 是否继承异常。
- 清除缩进统一用
dl dd { margin-inline-start: 0; }，比margin-left更符合 RTL 场景 - 若
dd内需居中或浮动布局，先设display: block，避免某些 Android WebView 的渲染错位 - 不要给
dd设float后忘记clear，否则后续dt可能错行
何时不该用 dl/dd 而该换结构
当「术语」本身是动态生成、缺乏明确命名，或详情内容远超简单描述（比如带操作按钮、表单、长表格），dl 就不再是最佳选择。它本质是语义化「名词解释」，不是布局工具。
- FAQ 列表如果每项含「展开/收起」交互，用
details/summary更合适 - 参数说明文档若含类型、必填、示例三列，用
table或带role="grid"的div更利于键盘导航 - 搜索结果摘要页里的标题+描述组合，应使用
article+header+p，而非硬套dl
最常被忽略的一点：用 dl 前先问自己——这个「术语」能否被单独提取出来作为词典条目？不能，就别用 dd。
