HTML の <base> 要素は、文書内に含まれるすべての相対 URL の基点となる URL を指定します。 <base> 要素は、文書内に1つだけ置くことができます。
文書のベース URL は document.baseURI を使用して、スクリプトから問い合わせることができます。
| コンテンツカテゴリー | メタデータコンテンツ |
|---|---|
| 許可されている内容 | なし。この要素は空要素です。 |
| タグの省略 | 終了タグを用いてはならない。 |
| 許可されている親要素 | 他の <base> 要素を含んでいない <head> |
| 許可されている ARIA ロール | なし |
| DOM インターフェイス | HTMLBaseElement |
属性
この要素にはグローバル属性があります。
href- 文書全体を通して相対 URL に使用されるベース URL です。この属性を指定する場合、この要素は属性値に URL を持つ他のどの要素よりも先に記述しなければなりません。絶対 URL と相対 URL が使用できます。
target- 名前またはキーワードで、ハイパーリンクやフォームによって移動が発生したときに、表示先が明確に示されていない要素において、結果を表示する既定の表示場所を示します。これは、閲覧コンテキスト（タブ、ウィンドウ、インラインフレーム）を示す名前またはキーワードです。以下のキーワードは特別な意味を持ちます。
_self: 同じ閲覧コンテキストに結果を読み込みます。この値は、属性が指定されていない場合の既定値です。_blank: 新しい無名の閲覧コンテキストに結果を読み込みます。_parent: 現在のコンテキストの親の閲覧コンテキストに結果を読み込みます。親がない場合、このオプションは_selfと同じ振る舞いをします。_top: 最上位の閲覧コンテキスト（現在のコンテキストの祖先で、それ以上の祖先をもたない閲覧コンテキスト）に結果を読み込みます。親がない場合、このオプションは_selfと同じ振る舞いをします。
使用上の注意
複数の <base> 要素が指定された場合、最初の href と最初の target の値が使用され、他はすべて無視されます。
例
<base href="http://www.example.com/page.html"> <base target="_blank" href="http://www.example.com/page.html">
仕様策定状況
| 仕様書 | 策定状況 | コメント |
|---|---|---|
| HTML Living Standard <base> の定義 |
現行の標準 | 最新のスナップショットから変更なし |
| HTML5 <base> の定義 |
勧告 | target の挙動を定義 |
| HTML 4.01 Specification <base> の定義 |
勧告 | target 属性を追加 |
ブラウザーの対応
このページの互換性一覧表は構造化データから生成されています。データに協力したいのであれば、 https://github.com/mdn/browser-compat-data をチェックアウトしてプルリクエストを送信してください。
| 機能 | Chrome | Edge | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| 基本対応 | あり | あり | 1 | あり1 | あり | あり |
href | あり | あり | 1 | あり | あり | あり |
target | あり | あり | あり | あり | あり | あり |
| 機能 | Android webview | Chrome for Android | Edge mobile | Firefox for Android | Opera Android | iOS Safari | Samsung Internet |
|---|---|---|---|---|---|---|---|
| 基本対応 | あり | あり | あり | 4 | あり | あり | あり |
href | あり | あり | あり | 4 | あり | あり | あり |
target | あり | あり | あり | あり | あり | あり | あり |
1. Before Internet Explorer 7, <base> can be positioned anywhere in the document and the nearest value of <base> is used.
ヒント
- ページ内でアンカータグ (例えば
<a href="#anchor">anchor</a>) を使用すると、ベース URL を参考にして解決され、ベース URL に対して HTTP リクエストを発行します。
例:
ベース URL:
<base href="http://www.example.com/">
アンカー:
<a href="#anchor">Anker</a>
参照先:
http://www.example.com/#anchor
OpenGraph
OpenGraph のメタタグはベース URL を認識しないので、次のように常に完全 URL を使用してください。
<meta property='og:image' content='http://example.com/thumbnail.jpg'>