リンクのタグ

【構文】<a href=”リンク先のファイルのパスまたはURL”>リンクになる対象</a>

ハイパーリンクと言って、クリックすると別のページを表示する仕組みを持たせるタグです。

リンクになる対象が文字列の場合、aタグで囲まれると標準では青字でアンダーラインが引かれ、マウスポインタを持っていくとポインタが手の形になり、そこがクリックできることを示します。また画像にもリンクを設定することができます。

aタグだけではリンクは機能しません。必ずhref属性で「どこにリンクするのか」を指定しなければなりません。

【属性】

属性属性値意味
href[例] web/index.html(相対パス)リンク元のファイルと同じフォルダ内にあるwebフォルダの中のindex.htmlファイルへのリンク
[例] https://www.yahoo.co.jp/(絶対パス)外部サイトの場合は、httpまたはhttpsから、ドメイン名を指定してリンク先を指定する
target[例] _blank新しいウィンドウまたはタブでリンク先を開く
title[例] ○○のページリンク先のページのタイトル

See the Pen
Untitled
by Koji Seto (@yseseto)
on CodePen.

絶対パスと相対パス

Webページを作成するときには、画像を表示させるために画像ファイルの場所を指定したり、リンクを設定するために、HTMLファイルの場所を指定したりします。

このとき、一番上の階層つまりコンピュータが基準になるのが絶対パス、リンク元のHTMLファイルが基準となるのが相対パスです。

絶対パスは主に外部サーバへのリンクを指定するときに使います。「http://」や「https://」に続き、ドメイン名を指定します。そしてフォルダ名やファイル名を指定します。

絶対パス

相対パスは、リンクが記述されているファイル自身が基準となり、同じフォルダ内であればファイル名だけでリンク先の指定ができます。同じフォルダ内でない場合、フォルダ名を指定して下層にあるファイルを、また、「../」で1つ上の層を指定します。

相対パス