基準URLを設定する
base要素で基準URLを設定する
/*base要素を使った記述*/
<base href="基準URL">
<base href="基準URL" target="表示先">base要素は、そのページで使用されている相対URLの基準位置を設定する要素です。
この設定を行うと、以降そのページで指定する相対URLは、すべてここで指定した絶対URLを基準としたものとして認識されます。この指定を行わなかった場合には、現在のページの位置が基準となります。
target属性を指定すると、リンク先のページを開くデフォルトのウィンドウやタブを指定することができます。
target属性に指定可能な値があり、この値によって「リンク先を別のウィンドウに表示する」ことができます。
なお、base要素は「属性値に相対URLを持つ他の要素」よりも先に配置しなければならない点に注意しましょう。
target属性の特別な４つの値
target属性に指定可能な値には、特別な４つの値があります。
リンク先を表示するフレームやウィンドウをtarget属性で指定することができます。このとき、予め決められている４種類の特別な名前があります。
それぞれの名前と機能は以下のようになっています。
| 値 | 概要 |
|---|---|
| _blank | 新しいウィンドウやタブに表示 |
| _self | 現在のウィンドウやタブに表示 |
| _parent | 親となる表示先に表示 |
| _top | 最上位となっている表示先に表示 |
値を指定した記述の一例です。
/*URLで指定したサイトを常に新しいウィンドウまたはタブを開いて表示*/
<a href="http://www.mysite.com/" target="_blank">mysite〇〇〇</a>URLの後ろに続けてtarget属性に値を指定します。
base要素で基準URLを設定した例
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>base要素を使った一例</title>
<base href="http://www.mysite.com/index.html"> /*link要素よりも先に配置*/
<link rel="previous" href="sample1.html"> /*base要素よりも後に配置*/
<link rel="next" href="sample3.html"> /*base要素よりも後に配置*/
</head>
<body></body>
</html>初心者の場合、基本的に絶対URLで記述することが多いと思います。しかし、基準URLを指定すると相対URLがファイル名だけで済み、簡潔な記述になります。
※例の場合、link要素で指定されている「sample1.html」と「sample3.html」は、それぞれ以下のような絶対URLとして扱われます。
/*絶対URLだとURLのすべてを記述*/
https:// www.mysite.com/sample1.html
https:// www.mysite.com/sample3.htmlRecommended books
