Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】base要素の使い方

base要素の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

baseオブジェクトは、HTMLドキュメント内で相対URLの基準となるベースURLを設定する役割を持つオブジェクトです。この要素は必ずHTMLドキュメントの<head>セクション内に一つだけ配置されます。

base要素でhref属性にURLを指定すると、そのドキュメント内のすべての相対URL(例えば、<a href="page.html"><img src="image.png"><link href="style.css"><script src="script.js">など)は、この指定されたURLを基準として解決されるようになります。これにより、ドキュメント内のさまざまなリソースへのパスを一元的に管理し、記述を簡潔に保つことができます。

また、base要素はtarget属性も持ち、これを使用することで、ドキュメント内のすべてのハイパーリンクのデフォルトのターゲットブラウジングコンテキスト(リンクをクリックしたときに新しいタブやウィンドウで開くかどうかなど)を一括して設定することが可能です。

base要素は、Webサイトの構造が複雑であったり、ドキュメントが移動する可能性がある場合などに特に有用です。ただし、この要素で指定されたベースURLは相対URLにのみ適用され、絶対URLで記述されたリソースへのパスには影響を与えません。適切な利用により、HTMLコードの可読性と保守性を高めることができます。

公式リファレンス: <base>: The Document Base URL element

構文(syntax)

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

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ