--- title: ': 文書の基底 URL 要素' slug: Web/HTML/Element/base tags: - Element - HTML - HTML 文書メタデータ - 'HTML:メタデータコンテンツ' - Reference - 要素 translation_of: Web/HTML/Element/base ---
{{HTMLRef}}

HTML の <base> 要素は、文書内におけるすべての相対 URL の基点となる URL を指定します。 <base> 要素は、文書内に1つだけ置くことができます。

文書に使われている基底 URL は、スクリプトから {{domxref('document.baseURI')}} を使用して問い合わせることができます。文書に <base> 要素がない場合、 baseURI は既定で {{domxref("location.href")}} になります。

コンテンツカテゴリ メタデータコンテンツ
許可されている内容 なし。この要素は{{Glossary("empty element", "空要素")}}。
タグの省略 終了タグを用いてはならない。
許可されている親要素 他に {{HTMLElement("base")}} 要素を含まない {{HTMLElement("head")}}。
暗黙の ARIA ロール 対応するロールなし
許可されている ARIA ロール 許可されている role なし
DOM インターフェイス {{domxref("HTMLBaseElement")}}

属性

この要素にはグローバル属性があります。

以下の属性のいずれかが指定されている場合、この要素は URL の属性値を持つ他の要素の前におかなければなりません。例えば {{HTMLElement("link")}} の href 属性などです。

{{htmlattrdef("href")}}
文書全体を通して相対 URL に使用される基底 URL です。絶対 URL と相対 URL が使用できます。
{{htmlattrdef("target")}}
キーワードまたは作者が定義した名前で既定の{{Glossary("browsing context", "閲覧コンテキスト")}}を表し、 {{HTMLElement("a")}} または {{HTMLElement("form")}} 要素が明示的に target 属性を持たない場合に、移動の結果を表示する先として使用されます。
以下のキーワードは特別な意味を持ちます。

使用上の注意

複数の <base> 要素

複数の <base> 要素が使用された場合、最初の href と最初の target の値が使用され、他はすべて無視されます。

ページ内アンカー

文書内のフラグメントを指すリンク — 例えば <a href="#some-id"> — は <base> によって解決され、基底 URL にフラグメントを付けて HTTP リクエストを発行します。例を示します。

  1. <base href="https://example.com"> が指定された場合
  2. ...そこで <a href="#anchor">Anker</a> というリンクの場合
  3. ...リンク先は https://example.com/#anchor となります。

Open Graph

OpenGraph のメタタグは <base> を認識しないので、次のように常に完全 URL を使用してください。

<meta property="og:image" content="https://example.com/thumbnail.jpg">

<base href="https://www.example.com/">
<base target="_blank">
<base target="_top" href="https://example.com/">

仕様書

仕様書 状態 備考
{{SpecName('HTML WHATWG', 'semantics.html#the-base-element', '<base>')}} {{Spec2('HTML WHATWG')}} 最新のスナップショットから変更なし
{{SpecName('HTML5 W3C', 'document-metadata#the-base-element', '<base>')}} {{Spec2('HTML5 W3C')}} target の挙動を定義
{{SpecName('HTML4.01', 'struct/links.html#h-12.4', '<base>')}} {{Spec2('HTML4.01')}} target 属性を追加

ブラウザーの互換性

{{Compat("html.elements.base")}}