address标签只允许phrasing content（如a、strong、em、br、纯文本），必须直接回答“谁写了页面或文章？如何联系？”，且仅在body或article的直接子元素位置生效。
address标签只能放哪些内容？
它只接受 phrasing content（短语内容），不是排版容器。写进去的东西必须能直接回答“谁写了这个页面或这篇文章？怎么联系他？”
- ✅ 允许：a（必须带 href="mailto:..." 或 tel:+86...）、strong、em、br、纯文本
- ❌ 禁止：p、div、ul、h3、section——浏览器会自动修复，HTML 验证失败，屏幕阅读器可能跳过整段
- ⚠️ 物理地址可以出现，但必须归属责任人并配可联络方式，比如：维护团队办公地：北京市朝阳区XX路1号邮箱:team@example.comaddress必须放在什么位置才生效？
语义绑定只在两个位置起作用，其他地方写了也白写：
- 作为 body 的直接子元素 → 表示整个页面的维护者或版权方（如官网页脚）
- 作为 article 的直接子元素 → 表示该文章的作者或编辑（如博客正文末尾）
- 出现在 section、div、header 里 → 浏览器和读屏器完全忽略，等同于没加
- 同一页面多个 address 都放在 body 下 → 只有第一个被识别为页面级联系人，其余降级为普通文本容器
为什么不能用 p 或 div 套联系方式？address 的内容模型被 HTML5 明确定义为仅允许内联级元素。强行嵌套块级元素会导致：
- HTML 验证失败（W3C validator 会报错）
- 浏览器自动修正 DOM 结构（比如把 p 提到 address 外，或包裹成匿名文本节点）
- 屏幕阅读器可能跳过解析，造成信息不可访问
- 某些旧版辅助工具（如 JAWS 早期版本）对非标准结构支持差，甚至静默丢弃内容
- 视觉上看似正常，但语义已断裂——你写的不是“联系信息”，只是“一堆文字”
现代浏览器还渲染斜体吗？要不要手动加样式？
Chrome 120+ 和 Firefox 125+ 已彻底移除 address 的默认 font-style: italic 和外边距。它现在视觉上和 div 几乎一样。
- 不必为“恢复斜体”而加样式，语义不依赖外观
- 但必须手动提供视觉区分，否则用户根本看不出这是联系信息：
- 比如加 border-left: 2px solid #007bff;
- 或用背景色 + 内边距营造独立区块感
- 别写 display: block——它本来就是块级元素，改了反而可能破坏小屏流式布局
body 的直接子元素 → 表示整个页面的维护者或版权方（如官网页脚）
- 作为 article 的直接子元素 → 表示该文章的作者或编辑（如博客正文末尾）
- 出现在 section、div、header 里 → 浏览器和读屏器完全忽略，等同于没加
- 同一页面多个 address 都放在 body 下 → 只有第一个被识别为页面级联系人，其余降级为普通文本容器
为什么不能用 p 或 div 套联系方式？address 的内容模型被 HTML5 明确定义为仅允许内联级元素。强行嵌套块级元素会导致：
- HTML 验证失败（W3C validator 会报错）
- 浏览器自动修正 DOM 结构（比如把 p 提到 address 外，或包裹成匿名文本节点）
- 屏幕阅读器可能跳过解析，造成信息不可访问
- 某些旧版辅助工具（如 JAWS 早期版本）对非标准结构支持差，甚至静默丢弃内容
- 视觉上看似正常，但语义已断裂——你写的不是“联系信息”，只是“一堆文字”
现代浏览器还渲染斜体吗？要不要手动加样式？
Chrome 120+ 和 Firefox 125+ 已彻底移除 address 的默认 font-style: italic 和外边距。它现在视觉上和 div 几乎一样。
- 不必为“恢复斜体”而加样式，语义不依赖外观
- 但必须手动提供视觉区分，否则用户根本看不出这是联系信息：
- 比如加 border-left: 2px solid #007bff;
- 或用背景色 + 内边距营造独立区块感
- 别写 display: block——它本来就是块级元素，改了反而可能破坏小屏流式布局
address 的默认 font-style: italic 和外边距。它现在视觉上和 div 几乎一样。
- 不必为“恢复斜体”而加样式，语义不依赖外观
- 但必须手动提供视觉区分，否则用户根本看不出这是联系信息：
- 比如加 border-left: 2px solid #007bff;
- 或用背景色 + 内边距营造独立区块感
- 别写 display: block——它本来就是块级元素，改了反而可能破坏小屏流式布局
真正难的不是语法对不对，而是每次写之前都得确认：这个信息，能不能准确回答「谁写了这篇？谁负责维护？出了问题找谁？」——答不上来，就别用 address。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
