リンクとパスを理解しよう aタグ（要素）
文字や画像をクリックさせて、目的のページや別サイトへ移動させるためにはハイパーリンク（以下リンク）という機能を利用します。
リンクを設定するにはaタグを利用します。
aタグのaはAnchor（アンカー）は錨（船のいかり）という意味を持ち、リンク（船）の出発点や到達点を設定（固定）できます。
| 要素 | a | リンク関係の設定を行う。 |
|---|---|---|
| 属性 | href | パスを指定し、リンク先の設定を行う |
| name | ラベルの設定を行う | |
| target | リンク先を表示する場所を設定できる | |
| 記述例 | <a href=”http://www.yahoo.co.jp”>検索エンジンヤフー</a>の使い方 (検索エンジンヤフーという文字にヤフーへのハイパーリンクを設定) |
|
| href | HyperText Referenceの頭文字が名前になっている属性で、値にリンク先を設定することでページを切り替えることができる。 リンク先の指定は絶対パスか相対パスのどちらかで指定する。絶対パスの例：<a href=”http://www.google.co.jp”>googleのページ</a> 相対パスの例：<a href=”../”>HTMLカテゴリページ</a>※絶対パスおよび相対パスの違いは下の記事をご覧ください ※パスおよび階層構造については「階層構造とパス」をご覧ください。 |
|---|---|
| name | ラベルの設定ができます。ページ内にラベルを設定するとページの先頭ではなく、そのラベルの場所まで移動することができます。 ※例は別記事参照 |
| target | ページの表示先を設定できます。値には「_blank」「_self」等があり、_blankは別ウィンドウ（もしくは別タブ、別フレーム）でリンク先を表示します。_selfは現在のウィンドウ（もしくは現在のタブ、現在のフレーム）でリンク先を表示します。 |
絶対パスと相対パス
href属性の値（リンク先）には絶対パスと相対パスを指定できます。主に、絶対パスは別サイトへのリンクを設定する場合、相対パスは同じサイト内で別ページへのリンクを設定する場合に使用します。
絶対パスはhttp://から記述するURLを指定し、別サイトへのリンクを設定します。
相対パスは現在のページを基準としたリンク先を指定し、同じサイト内の別ページや画像へのリンクを設定します。
※上記の説明は一般的なもので、同じサイト内でも絶対パスを利用することもあります。
練習
下の入力欄に「買い物なら楽天」という文字に「http://rakuten.co.jp」のリンクを設定して、別ウィンドウで表示する設定にしてみましょう。
※「」は入力しません。
結果が表示されます
スポンサードリンク
関連記事
スポンサードリンク