HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLのタグでページのベースURLを定義する方法

HTMLの<base>タグとは

HTMLの<base>タグは、ページ内のすべての相対URLに対する基準URL(ベースURL)とデフォルトのターゲットを指定するための要素です。このタグは必ず<head>…</head>セクション内に記述します。ページのheadセクションでベースURLを一度設定しておけば、以降に記述される相対リンクや画像パスは、すべてそのURLを起点として解決されます。

これにより、各リンクごとに完全なURLを書く必要がなくなり、コードがすっきりし、サイト移転時などのURL変更にも柔軟に対応できるようになります。

<base>タグの主な属性

属性説明
hrefURLベースURL(基準となるアドレス)を指定します。
target_blank
_parent
_self
_top
ターゲットURLをどこで開くかを指定します。
_blank:新しいウィンドウ(またはタブ)で開きます。
_self:クリックされたのと同じフレーム内で開きます。
_parent:親フレームセットで開きます。
_top:ウィンドウ全体(全フレームを解除した状態)で開きます。

使用例

以下のコードを実行して、HTMLの<base>タグの動作を確認してみましょう。

<!DOCTYPE html>
<html>
   <head>
      <title>HTML base Tag</title>
      <base href = "https://www.tutorialspoint.com" />
   </head>
   <body>
      HTML: <br><img src = "/images/html.gif" />
   </body>
</html>

この例では、<base href="https://www.tutorialspoint.com" />によってベースURLが設定されているため、<img>タグの「/images/html.gif」という相対パスは、「https://www.tutorialspoint.com/images/html.gif」として解決されます。

  1. HTMLページでタイトル(title)タグを使う方法をわかりやすく解説

    HTMLドキュメントにおいて、タイトルは欠かせない要素です。文書のタイトルを定義するには、<title>タグを使用します。このタイトルは、ブラウザのタブやツールバーに表示されるほか、Googleなどの検索エンジンの検索結果にもページ名として表示されます。そのため、タイトルはSEO(検索エンジン最適化)の観点からも非常に重要であり、ページの内容を的確に表すキーワードを含めることが推奨されます。titleタグを記述する場所注意すべき点として、<title>〜</title>タグは必ず<head>〜</head>タグの中に記述する必要があり

  2. HTMLのdatalistタグの使い方!入力候補リストを作成する方法

    datalistタグとは?HTMLの<datalist>タグは、<input>要素に対して選択肢(候補リスト)を定義するためのタグです。テキストフィールドにユーザーが入力を始めると、あらかじめ用意された候補がドロップダウン形式で表示されるため、入力の手間を減らし、入力ミスを防ぐことができます。<datalist>タグを使用する際のポイントは以下の2点です。・<input>要素側にlist属性を指定し、その値と<datalist>要素のid属性を一致させる・選択肢は<datalist>〜</datalist>の中