Introduction
In web development, presenting contact information elegantly is essential. HTML provides the <address> tag for this purpose, ensuring consistency and professionalism.
<address>
Headquarters:<br>
TechCorp Inc.<br>
123 Tech Street<br>
Silicon Valley, CA 94043<br>
<a href="tel:+18001234567">+1 800-123-4567</a>
</address>
Try this out below:
The <address> Tag Explained
The <address> tag defines the contact information for the author or owner of a document or article. It’s typically displayed in italic.
Example:
<address>
Contact information for TechHub.com:
<a href="mailto:support@techhub.com">support@techhub.com</a>
</address>
Usage and Styling
The text inside the <address> tag is usually rendered in italics. Customize the appearance using CSS:
address {
display: block;
font-style: italic;
}
Browser Support
The <address> tag is widely supported across all major browsers. Here’s a table showing the support:
| Browser | Support |
|---|---|
| Chrome | Yes |
| Firefox | Yes |
| Safari | Yes |
| Edge | Yes |
| Internet Explorer | Yes |
Global Attributes
The <address> tag also supports the Global Attributes in HTML.
Event Attributes
The <address> tag also supports the Event Attributes in HTML.
Practical Example Using A Corporate Website Address
Explanation
This revised example showcases how to present contact information for a fictional tech company, TechWorld. The <address> tag is used to encapsulate the contact details, including an email link.
The CSS has been modified to remove the italic styling, and instead, a border, padding, and margin have been added to give the address section a distinct appearance.
The content within the <address> tag has been changed to reflect a different scenario, providing a fresh context for the example.
The heading and paragraph text has also been updated to align with the new context, guiding the user to contact the support team and encouraging customization of the CSS.