試一試
<p>Contact the author of this page:</p>
<address>
<a href="mailto:jim@example.com">jim@example.com</a><br />
<a href="tel:+14155550132">+1 (415) 555‑0132</a>
</address>
a[href^="mailto"]::before {
content: "📧 ";
}
a[href^="tel"]::before {
content: "📞 ";
}
<address> 元素的聯絡資訊內容可以根據上下文以任何合適的形式呈現,並且可以包含任何必要的聯絡資訊型別,例如實際地址、URL、電子郵件地址、電話號碼、社交媒體賬號、地理座標等。<address> 元素應包含聯絡資訊所指的個人、多人或組織的名稱。
<address> 可用於多種場景,例如在頁面頁首中提供公司的聯絡資訊,或者透過在 <article> 中包含 <address> 元素來指明文章的作者。
屬性
此元素僅包含全域性屬性。
用法說明
示例
此示例演示瞭如何使用 <address> 來標記文章作者的聯絡資訊。
html
<address>
You can contact author at
<a href="http://www.example.com/contact">www.example.com</a>.<br />
If you see any bugs, please
<a href="mailto:webmaster@example.com">contact webmaster</a>.<br />
You may also want to visit us:<br />
Mozilla Foundation<br />
331 E Evelyn Ave<br />
Mountain View, CA 94041<br />
USA
</address>
結果
儘管它在預設樣式上與 <i> 或 <em> 元素相同,但在處理聯絡資訊時使用 <address> 更為合適,因為它傳達了額外的語義資訊。
技術摘要
| 內容類別 | 流內容,可感知內容。 |
|---|---|
| 允許內容 |
流內容,但不能巢狀 <address> 元素,不能包含標題內容(<hgroup>、h1、h2、h3、h4、h5、h6),不能包含分節內容(<article>、<aside>、<section>、<nav>),也不能包含 <header> 或 <footer> 元素。 |
| 標籤省略 | 無,起始標籤和結束標籤都必須存在。 |
| 允許父級 | 任何接受 流內容 的元素,但始終排除 <address> 元素(根據對稱性的邏輯原則,如果 <address> 標籤作為父元素不能有巢狀的 <address> 元素,那麼同一個 <address> 內容也不能以 <address> 標籤作為其父元素)。 |
| 隱式 ARIA 角色 |
group
|
| 允許的 ARIA 角色 | 任意 |
| DOM 介面 |
HTMLElement 在 Gecko 2.0 (Firefox 4) 之前,Gecko 使用 HTMLSpanElement 介面實現了此元素。 |
規範
| 規範 |
|---|
| HTML # the-address-element |
瀏覽器相容性
載入中…