<address>标签专用于联系信息而非地理地址，必须嵌套在明确主体上下文中（如<article>或<footer>），禁止直接置于<body>顶层；内部允许内联元素但禁用块级元素；多作者场景下每个<address>须独立归属且紧邻对应内容。
address 标签不是“地理地址”的通用容器
它只表示「联系信息」，不是街道门牌号或坐标点。比如 上海市浦东新区世纪大道100号 单独出现，没附带邮箱、电话、作者名，就不该用 address。浏览器和屏幕阅读器会把它理解为“这个页面/文章的作者或责任方联系方式”，语义错位会导致辅助技术误读、SEO 权重稀释。
- 正确归属：必须嵌套在有明确主体的上下文中，比如
<article>里标作者邮箱，<footer>里标运维联系人 - 错误位置：直接放在
<body>顶层、<div>或<section>（除非加了role="article"） - 纯地理地址替代方案：用
<p>+aria-label，或结构化数据用<dl>配合itemprop="address"
address 内部能放什么，不能放什么
address 允许内联元素（如 <a>、<time>、<span>），但禁止块级元素（如 <p>、<h2>、<div>）。HTML5 虽然允许块级内容，但语义上已冗余——它本就代表一段联系信息，再包一层段落反而模糊焦点。
- 推荐写法：
<address>作者：<code>张三｜邮箱：<a href="mailto:zhang@example.com">zhang@example.com</a>｜Twitter：<a href="https://twitter.com/@zhang">@zhang</a></address> - 链接必须真实可点击：
mailto:和tel:协议要完整，不能写成zhang@example.com纯文本 - 避免塞入无关内容：营业时间、交通指南、二维码图片等应拆到
<section>或<dl>中
样式控制别被默认斜体带偏
所有浏览器默认给 address 加 font-style: italic，但这只是历史遗留，不是语义要求。你可以也应当用 CSS 重置它：
address {
font-style: normal;
line-height: 1.5;
margin-top: 0;
}
address a {
text-decoration: underline;
}
- 不要因为“不想斜体”就弃用
address；也不该为了“看起来像地址”而硬套它 - 图标、背景色、间距调整都可行，但前提是不掩盖其作为联系信息的本质
- 若需视觉分组（如把邮箱和电话横向排列），用
display: flex或grid，别用<table>
多作者或多归属场景怎么处理
一个页面可以有多个 address，但每个都必须指向清晰的归属主体。常见于合著文章、API 文档不同模块的责任人、官网多语言版本的本地支持入口。
立即学习“前端免费学习笔记（深入）”；
- 每个
address应紧邻其所属内容块，比如第二位作者的简介后立刻跟一个address - 避免共用父容器再统一声明归属，比如
<section><h3>作者团队</h3><address>A</address><address>B</address></section>是合法的，但必须确保 A/B 各自信息完整独立 - 不要用
class="author-1"这类无语义类名代替结构表达；必要时可用aria-labelledby关联标题
最容易被忽略的是上下文断裂——把 address 抽出来单独复用、或跨组件传递时，它脱离原始语境就失去语义价值。用之前先问一句：这段信息，到底属于谁？
