HTML辞書ホームへ
HTML要素 辞書 by Sentaro
<address>
連絡先情報(Address)要素。最も近い <article> または <body> 要素の作者や編集者、ドキュメント管理者などの連絡先情報を提供します。
info
概要
<address> 要素は、そのコンテンツが提供するHTMLドキュメントまたは <article> 要素の作者、管理者、または編集者に関する**連絡先情報**を定義します。
これは、物理的な住所を示すためだけの要素ではありません。電子メールアドレス、URL、電話番号、ソーシャルメディアのハンドルネームなど、連絡を取るための情報を含めることができます。
play_circle
デモ (静的表示)
HTML (Source)
<footer>
<address>
著者: <a href="mailto:author@example.com">山田 太郎</a>.
<br>
最終更新: <time datetime="2025-12-14">2025年12月14日</time>
</address>
</footer>
Preview (Result)
list
属性 (Attributes)
| 属性名 | 説明 |
|---|---|
| グローバル属性 | 全てのHTML要素で利用可能な属性です(例: class, id, lang)。 |
code
実用例
1. 記事の作者情報として使用する
<article>
<h2>最新のWeb技術動向</h2>
<p>... 記事本文 ...</p>
<footer>
<address>
この記事は <a href="/authors/jsmith">John Smith</a> によって書かれました。
<br>
連絡先: <a href="mailto:j.smith@webdev.com">j.smith@webdev.com</a>
</address>
</footer>
</article>
2. サイト全体のフッターで連絡先を示す
<footer>
<p>© 2025 HTML要素 辞書</p>
<address>
管理者連絡先: <a href="/contact-us/">お問い合わせフォーム</a>
<br>
電話番号: <a href="tel:0120-123-456">0120-123-456</a>
</address>
</footer>
3. 誤った使い方(物理的な住所のみを示す場合)
<!-- <address>の誤った使用例 -->
<section>
<h3>店舗情報</h3>
<address>
〒100-0001 東京都千代田区千代田 1-1-1
</address>
<!-- ⬆️ この場合、単なる <p> や <div> を使用し、構造化データでマークアップするのが適切です -->
</section>
lightbulb
知っておくべき重要事項
info
セマンティクス(意味)の理解
<address> 要素は、その内容(記事やドキュメント全体)の**所有者/作者/管理者**の連絡先を示すために使用されます。企業の物理的な住所や商品の配送先住所など、**文書の内容と関連のない連絡先**を示すためには使用しないでください。
visibility
ブラウザによる既定のスタイル
多くのブラウザでは、
多くのブラウザでは、
<address> 要素の内容を既定で*斜体*(イタリック体)で表示します。このスタイルはCSSで上書きすることが可能です。