aboutsummaryrefslogtreecommitdiff
path: root/files/ja/web/html/element/address/index.html
blob: 3b393b3034d5942cabd3e28900fa4ac9c0932b1b (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
---
title: '<address>: 連絡先要素'
slug: Web/HTML/Element/address
tags:
  - Address
  - Author
  - Contact
  - Contact Information
  - Element
  - Email
  - Email Address
  - HTML
  - HTML sections
  - 'HTML:Flow content'
  - 'HTML:Palpable Content'
  - Reference
  - Web
translation_of: Web/HTML/Element/address
---
<div>{{HTMLRef}}</div>

<p id="Summary"><span class="seoSummary"><strong>HTML の <code>&lt;address&gt;</code> 要素</strong>は、これを含んでいる HTML が個人、団体、組織の連絡先を提供していることを示します。</span></p>

<div>{{EmbedInteractiveExample("pages/tabbed/address.html", "tabbed-standard")}}</div>

<div class="hidden">このデモのソースファイルは GitHub リポジトリに格納されています。デモプロジェクトに協力したい場合は、 <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> をクローンしてプルリクエストを送信してください。</div>

<p><code>&lt;address&gt;</code> 要素の内容で提供される連絡先情報は、その文脈で適切であればどのような形でもよく、必要とされるあらゆる形の連絡先情報 (住所、 URL、メールアドレス、電話番号、ソーシャルメディアのアカウント、地理上の座標など) を含めることができます。 <code>&lt;address&gt;</code> には連絡先情報が参照する個人、団体、組織の名前を含めてください。</p>

<p><code>&lt;address&gt;</code> は様々な文脈で使用することができ、ページヘッダーでビジネスの連絡先を提供したり、 {{HTMLElement("article")}} 要素の中で <code>&lt;address&gt;</code> を含めることで、記事の著者を識別したりすることができます。</p>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row"><a href="/ja/docs/Web/HTML/Content_categories">コンテンツカテゴリ</a></th>
   <td><a href="/ja/docs/Web/HTML/Content_categories#Flow_content">フローコンテンツ</a><a href="/ja/docs/Web/HTML/Content_categories#Palpable_content">知覚可能コンテンツ</a></td>
  </tr>
  <tr>
   <th scope="row">許可されている内容</th>
   <td><a href="/ja/docs/Web/HTML/Content_categories#Flow_content">フローコンテンツ</a>。ただし <code>&lt;address&gt;</code> 要素をネストしたり、見出しコンテンツ ({{HTMLElement("hgroup")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}), 区分コンテンツ ({{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("section")}}, {{HTMLElement("nav")}}), {{HTMLElement("header")}} 要素および {{HTMLElement("footer")}} 要素を入れたりしてはなりません。</td>
  </tr>
  <tr>
   <th scope="row">タグの省略</th>
   <td>{{no_tag_omission}}</td>
  </tr>
  <tr>
   <th scope="row">許可されている親要素</th>
   <td><a href="/ja/docs/Web/HTML/Content_categories#Flow_content">フローコンテンツ</a> を受け入れるすべての要素。ただし <code>&lt;address&gt;</code> 要素は除く (論理的な対称性の原理によれば、親要素である <code>&lt;address&gt;</code> タグは <code>&lt;address&gt;</code> 要素を入れ子にすることができません。したがって、同じ <code>&lt;address&gt;</code> のコンテンツの親に <code>&lt;address&gt;</code> タグを置くこともできません)。</td>
  </tr>
  <tr>
   <th scope="row">暗黙の ARIA ロール</th>
   <td><a href="https://www.w3.org/TR/html-aria/#dfn-no-corresponding-role">対応するロールなし</a></td>
  </tr>
  <tr>
   <th scope="row">許可されている ARIA ロール</th>
   <td>すべて</td>
  </tr>
  <tr>
   <th scope="row">DOM インターフェイス</th>
   <td>{{domxref("HTMLElement")}}。 Gecko 2.0 (Firefox 4) より前では {{domxref("HTMLSpanElement")}} インターフェイスが提供されます。</td>
  </tr>
 </tbody>
</table>

<h2 id="Attributes" name="Attributes">属性</h2>

<p>この要素には<a href="/ja/docs/Web/HTML/Global_attributes" title="HTML/Global attributes">グローバル属性</a>のみがあります。</p>

<h2 id="Usage_notes" name="Usage_notes">使用上の注意</h2>

<ul>
 <li><code>&lt;address&gt;</code> 要素は文書の著者の連絡先情報を表すだけのために使われる傾向があります。しかし最新の仕様書では、定義が更新され、様々な宛先をマークアップするために使用できるようになりました。</li>
 <li>この要素には、公開日 ({{HTMLElement("time")}} によるもの) のような連絡先情報以外の情報を含めるべきではありません。</li>
 <li>一般的に、 <code>&lt;address&gt;</code> 要素は現在のセクションに {{HTMLElement("footer")}} 要素があれば、その中に配置することができます。</li>
</ul>

<h2 id="Examples" name="Examples"></h2>

<p>この例は <code>&lt;address&gt;</code> 要素で記事の編集者の連絡先情報を示す使い方を示します。</p>

<pre class="brush: html notranslate">  &lt;address&gt;
    You can contact author at &lt;a href="http://www.somedomain.com/contact"&gt;
    www.somedomain.com&lt;/a&gt;.&lt;br&gt;
    If you see any bugs, please &lt;a href="mailto:webmaster@somedomain.com"&gt;
    contact webmaster&lt;/a&gt;.&lt;br&gt;
    You may also want to visit us:&lt;br&gt;
    Mozilla Foundation&lt;br&gt;
    331 E Evelyn Ave&lt;br&gt;
    Mountain View, CA 94041&lt;br&gt;
    USA
  &lt;/address&gt;
</pre>

<h3 id="Result" name="Result">結果</h3>

<p>{{EmbedLiveSample("Examples", "300", "200")}}</p>

<p>この要素は文字列を {{HTMLElement("i")}} 要素や {{HTMLElement("em")}} 要素と同じ既定のスタイルで描画しますが、付加的な意味情報として連絡先情報を扱うときに <code>&lt;address&gt;</code> を使用するのがより適切でしょう。</p>

<h2 id="Specifications" name="Specifications">仕様書</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">仕様書</th>
   <th scope="col">状態</th>
   <th scope="col">備考</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('HTML WHATWG', 'sections.html#the-address-element', '&lt;address&gt;')}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-address-element', '&lt;address&gt;')}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td></td>
  </tr>
  <tr>
   <td>{{SpecName('HTML4.01', 'struct/global.html#h-7.5.6', '&lt;address&gt;')}}</td>
   <td>{{Spec2('HTML4.01')}}</td>
   <td></td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility" name="Browser_compatibility">ブラウザーの互換性</h2>

<p>{{Compat("html.elements.address")}}</p>

<h2 id="See_also" name="See_also">関連情報</h2>

<ul>
 <li>他のセクション関連要素: {{HTMLElement("body")}}, {{HTMLElement("nav")}}, {{HTMLElement("article")}}, {{HTMLElement("aside")}}, {{HTMLElement("h1")}}, {{HTMLElement("h2")}}, {{HTMLElement("h3")}}, {{HTMLElement("h4")}}, {{HTMLElement("h5")}}, {{HTMLElement("h6")}}, {{HTMLElement("hgroup")}}, {{HTMLElement("footer")}}, {{HTMLElement("section")}}, {{HTMLElement("header")}}</li>
 <li class="last"><a class="deki-ns current" href="/ja/docs/Sections_and_outlines_of_an_HTML5_document" title="Sections and Outlines of an HTML5 document">HTML5 文書のセクションとアウトライン</a></li>
</ul>