: The Contact Address element
The <address> HTML element indicates that the enclosed HTML provides contact information for a person or people, or for an organization.
{{InteractiveExample("HTML Demo: <address>", "tabbed-standard")}}
<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: "📞 ";
}
The contact information provided by an <address> element’s contents can take whatever form is appropriate for the context, and may include any type of contact information that is needed, such as a physical address, URL, email address, phone number, social media handle, geographic coordinates, and so forth. The <address> element should include the name of the person, people, or organization to which the contact information refers.
<address> can be used in a variety of contexts, such as providing a business’s contact information in the page header, or indicating the author of an article by including an <address> element within the {{HTMLElement("article")}} .
Attributes
This element only includes the global attributes.
Usage notes
- The
<address>element can only be used to represent the contact information for its nearest{{HTMLElement("article")}}or{{HTMLElement("body")}}element ancestor. - This element should not contain more information than the contact information, like a publication date (which belongs in a
{{HTMLElement("time")}}element). - Typically an
<address>element can be placed inside the{{HTMLElement("footer")}}element of the current section, if any.
Examples
This example demonstrates the use of <address> to demarcate the contact information for an article’s author.
<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>
Result
{{EmbedLiveSample("Examples", "300", "200")}}
Although it renders text with the same default styling as the {{HTMLElement("i")}} or {{HTMLElement("em")}} elements, it is more appropriate to use <address> when dealing with contact information, as it conveys additional semantic information.
Technical summary
| Content categories | Flow content, palpable content. |
|---|---|
| Permitted content |
Flow content, but with no nested <address> element, no heading
content (`{{HTMLElement("hgroup")}}` , `{{HTMLElement("Heading_Elements", "h1")}}` ,
`{{HTMLElement("Heading_Elements", "h2")}}` , `{{HTMLElement("Heading_Elements", "h3")}}` ,
`{{HTMLElement("Heading_Elements", "h4")}}` , `{{HTMLElement("Heading_Elements", "h5")}}` ,
`{{HTMLElement("Heading_Elements", "h6")}}` ), no sectioning content
(`{{HTMLElement("article")}}` , `{{HTMLElement("aside")}}` ,
`{{HTMLElement("section")}}` , `{{HTMLElement("nav")}}` ), and
no `{{HTMLElement("header")}}` or `{{HTMLElement("footer")}}`
element.
|
| Tag omission | None, both the starting and ending tag are mandatory. |
| Permitted parents |
Any element that accepts
flow content, but always excluding <address> elements (according
to the logical principle of symmetry, if
<address> tag, as a parent, can not have nested
<address> element, then the same
<address> content can not have
<address> tag as its parent).
|
| Implicit ARIA role |
group
|
| Permitted ARIA roles | Any |
| DOM interface | `{{domxref("HTMLElement")}}` Prior to Gecko 2.0 (Firefox 4), Gecko implemented this element using the `{{domxref("HTMLSpanElement")}}` interface |
Specifications
{{Specifications}}
Browser compatibility
{{Compat}}
See also
- Others section-related elements:
{{HTMLElement("body")}},{{HTMLElement("nav")}},{{HTMLElement("article")}},{{HTMLElement("aside")}},{{HTMLElement("Heading_Elements", "h1")}},{{HTMLElement("Heading_Elements", "h2")}},{{HTMLElement("Heading_Elements", "h3")}},{{HTMLElement("Heading_Elements", "h4")}},{{HTMLElement("Heading_Elements", "h5")}},{{HTMLElement("Heading_Elements", "h6")}},{{HTMLElement("hgroup")}},{{HTMLElement("footer")}},{{HTMLElement("section")}},{{HTMLElement("header")}}; - Sections and outlines of an HTML document.