address标签仅在body或article的直接子元素位置有效,分别标识页面维护者或文章作者;内容限于内联可交互联系信息,现代浏览器已移除默认斜体样式。

address 标签不是“放地址的容器”,它只定义责任归属边界:谁写了这个页面,或谁对当前 article 负责。用错位置,语义就失效,屏幕阅读器会误读,SEO 也不会因此加分。
什么时候 address 才真正生效?看父级元素
它的语义绑定只在两个确切上下文中成立,其他地方写了等于白写:
-
body的直接子元素 → 表示整页维护者、版权方(如官网页脚) -
article的直接子元素 → 表示该文章作者/编辑(如博客正文末尾) - 嵌套在
section、div、header或footer里 → 浏览器和读屏器完全忽略其语义 - 同一页面多个
address都放在body下 → 只有第一个被识别为页面级联系人,其余降级为普通文本
address 里能写什么?哪些内容一放就破坏验证
HTML5 明确限定其内容模型为 phrasing content(短语内容),即只能放内联、可交互、归属明确的项:
- ✅ 合法:
<a href="https://www.php.cn/link/6bca76cea8f3c180cd035d70f9bc7b0c">admin@example.com</a>、<a href="tel:+861012345678">010-12345678</a>、<strong>张三</strong>、<em>前端组</em>、<br>、纯文本如“维护:技术部” - ❌ 禁止:
<p></p>、<div>、<code><h3></h3>、<ul></ul>—— 触发 HTML 验证失败,部分浏览器自动修复或静默跳过整段 - ⚠️ 物理地址必须带归属+可联络性,例如“办公地:北京市朝阳区XX路1号(技术组收)”,单写“上海市浦东新区XX大厦”无效
- 千万别写
display: inline—— 它本就是块级元素,强行改可能破坏小屏流式布局 - 若页面支持深色模式,记得重置
a:link颜色,否则邮箱链接可能因对比度不足不可读
现代浏览器里 address 还有默认样式吗?要不要重置?
Chrome 120+、Firefox 125+ 已彻底移除 address 的默认 font-style: italic 和外边距。它现在视觉上和 <div> 几乎一样。
<ul>
<li>不要依赖斜体表达语义——语义靠标签本身,样式靠 CSS</li>
<li>建议手动加区分样式,比如:<code>address { border-left: 2px solid #007bff; padding-left: 1em; }
最容易被忽略的不是怎么写,而是作用域判断:你写的这个 address,是否真的属于它最近的 article 或 body 的责任人?跨作用域混用,等于向辅助技术撒谎。











