構文

<p>・・・<a>・・・</a>・・・</p>

説明文

　WWWは世界中にあるWebページをリンクし，Webのネットワークを作ってゆく。<a>タグでは，他のWebページにリンクをする。リンクを行う場合は，「href」属性にリンク先のURLを指定する。また，<a>?</a>に囲まれた文字列にリンクが張られ，この文字列をクリックすることで目的のページに移動できる。リンクされた文字列は一般的に下線付きの青文字で表示される。ただし，Webブラウザの設定やスタイル・シートの指定によってはリンクした文字の文字色や文字装飾が異なる場合がある。

　<a>タグはWebページにリンクする以外に，ページ内の特定の位置にじゃん部することも可能だ。この際は，<a>に「name」属性を用いることで，ジャンプ先の目印を付けておける。

　さらに，メール・アドレスを指定しておくことで，そのメール・アドレスにメールを送信したり，FTPサーバーへアクセスするなどといった事も行える。

　<a>タグはインライン要素であるため，基本的にブロック要素の中で利用するようにする。

サンプル

HTMLソース

<h2><a name="index">目次</a></h2>
<ul>
    <li><a href="start.html">はじめに</a></li>
    <li><a href="document/part1.html">第1章　WWW</a></li>
        ：
    <li><a href="document/reference.html#web">参考文献</a></li>
    <li><a href="#attension">注意事項</a></li>
</ul>
　　：
<p>　Linuxについての情報は，日経BP社の<a href="http://linux.
nikkeibp.co.jp/">日経LinuxのWebページ</a>から閲覧することが可能です。・・・</p>
　　：
<h2><a name="attension">注意事項</a></h2>
<p>　本コンテンツで紹介したサンプルは・・・</p>
　　：

ブラウザ表示例

目次

　　：

　Linuxについての情報は，日経BP社の日経LinuxのWebページから閲覧することが可能です。・・・

　　：

注意事項

　本コンテンツで紹介したサンプルは・・・

　　：

※ 紹介したサンプルのリンク先の一部は実在しません。そのため，実際しないコンテンツへのリンクをクリックしてもページが表示されません。


対応状況

HTML IE Firefox Opera
4 strict 4 Transitional 5 6 7 2 3 8 9
○ ○ ○ ○ ○ ○ ○ ○ ○

要素，タグ

タグ要素 インライン要素
包括可能要素 インライン要素（<a>タグは含められない）
タグ記述条件 開始タグ：必須　終了タグ：必須

属性

よく利用する属性

属性 意味 対応
HTML 4s HTML 4t その他
href=URL リンク先のURLを指定する。<a>タグにくくられた文字列をクリックするとhref属性に指定したURLへ移動する ○ ○ 　
name=アンカー名 ページ内の特定の部分を参照するための目印（アンカー）を指定する。name属性に指定した<a>タグに位置に移動したい場合は，<a hrte="#アンカー名">・・・</a>のようにシャープ記号の後にアンカー名を指定する ○ ○ 　

その他の属性

属性 意味 対応
HTML 4s HTML 4t その他
accesskey=キー このタグにフォーカスするキー設定を行う。「A」と指定すると，[ALT]+[a]を押下することでこのタグにフォーカスが移動する ○ ○ 　
charset=文字セット リンク先のコンテンツで利用している文字セットを指定する。例えば，ユニコードを利用している場合は「UTF-8」などと指定する ○ ○  
class=クラス名 このタグのクラス名。CSSでスタイルを指定する場合などに利用される ○ ○ 　
coords=座標 クリッカブル真布となる領域の座標を指定する。領域の指定方法は形状によって異なる。形状が矩形の場合は，左上，右下の座標を「x1,y1,x2,y2」と指定する。形状が多角形の場合は，各座標を「x1,y1,x2,y2,x3,y3」列挙する。形状が円形の場合は「x,y,r」と中心の座標，半径の順に指定する。詳しくは，<map>を参照 ○ ○  
dir=方向 タグ内の文字の表示方向。「ltr」を指定すると文字を左から右に，rtlを指定すると「右から左」に表示する。しかし，多くのWebブラウザでは，文字コードを自動判別し，自動的に表示方向を決定している。そのため，日本語を「rtl」と指定しても実際には左から右に表示される。強制的に並び替えを行いたい場合は<bdo>タグを利用する ○ ○ 　
hreflang=言語 リンク先のコンテンツの記述言語を指定する。例えば、英語であれば「en」，イタリア語であれば「it」と指定する ○ ○ 　
id=ID タグのID。ダイナミックHTMLでタグを操作する場合や，Java Scriptでのタグの制御，個別にスタイルを指定する場合などに利用する ○ ○ 　
lang=言語 タグ内に記述した言語。例えば，日本語の場合は「ja」，英語の場合は「en」を指定する ○ ○ 　
rel=関係性 このコンテンツから見た，リンク先のコンテンツとの関係を指定する。「next」は次のコンテンツ，「previous」は前のコンテンツ，「parent」は親コンテンツを表す ○ ○ 　
rev=関係性 リンク先のコンテンツから見た、このコンテンツとの関係を指定する。「next」は次のコンテンツ，「previous」は前のコンテンツ，「parent」は親コンテンツを表す ○ ○ 　
shape=形状 クリッカブルマップの領域の形状を指定する。形状が矩形の場合は「rect」，多角形の場合は「poly」，円形の場合は「circle」，前述した形状以外の範囲の場合は「default」を指定する。詳しくは，<map>を参照 ○ ○  
style=スタイル タグのスタイル。スタイルの指定方法については「CSSの基本 (2) CSSの記述位置」を参照 ○ ○ 　
tabindex=順序 タブ・キーによるフォーカスの移動順序を指定する。値が小さいほど先にフォーカスされる ○ ○ 　
target=ターゲット リンクの表示先を指定する。「_blank」を指定するとあらたなウインドウを開きそこに表示する。「_self」を指定すると、リンク元となるコンテンツを表示しているウインドウに表示する。「_top」を指定するとこのフレームを解除して最上位となるウインドウに表示する。「_parent」を指定すると、フレームの全体を解除し表示する。また、特定のフレームに表示する場合はフレーム名を指定する × ○  
title=タイトル タグのタイトル。一般的にタグの補足情報を記述する。一般的なWebブラウザでは，タグ上にマウス・ポインタを乗せるとツール・チップにtitle属性に指定した内容を表示する ○ ○ 　
type=MIMEタイプ リンク先となるコンテンツの形式をMIMEタイプを指定する。例えば，HTMLファイルであれば「text/html」，JPEG画像であれば「image/jpeg」と指定する ○ ○  

マウスやキーボードの状況変化に関わる属性

属性 意味 対応
HTML 4s HTML 4t その他
onclick=スクリプト このタグに対応する表示結果にマウスの左ボタンをクリックした場合に，指定したスクリプトを実行する ○ ○  
ondblclick=スクリプト このタグに対応する表示結果にマウスの左ボタンをダブル・クリックした場合に，指定したスクリプトを実行する ○ ○  
onmousedown=スクリプト このタグに対応する表示結果にマウスのボタンで押下した場合に，指定したスクリプトを実行する ○ ○  
onmouseup=スクリプト このタグに対応する表示結果にマウスのボタンを離した場合に，指定したスクリプトを実行する ○ ○  
onmouseover=スクリプト このタグに対応する表示結果にマウス・ポインタが乗った場合に，指定したスクリプトを実行する ○ ○  
onmousemove=スクリプト このタグに対応する表示結果上でマウス・ポインタが動いた場合に，指定したスクリプトを実行する ○ ○  
onmouseout=スクリプト このタグに対応する表示結果にマウス・ポインタが外れた場合に，指定したスクリプトを実行する ○ ○  
onkeypress=スクリプト このタグに対応する表示結果にフォーカスした状態で，キーボードのキーを押下して離した場合に，指定したスクリプトを実行する ○ ○  
onkeydown=スクリプト このタグに対応する表示結果にフォーカスした状態で，キーボードのキーを押下した場合に，指定したスクリプトを実行する ○ ○  
onkeyup=スクリプト このタグに対応する表示結果にフォーカスした状態で，キーボードのキーから離した場合に，指定したスクリプトを実行する ○ ○  
onfocus=スクリプト このタグに対応する表示結果にフォーカスが当たった場合に，指定したスクリプトを実行する ○ ○  
onblur=スクリプト このタグに対応する表示結果にフォーカスが外れた場合に，指定したスクリプトを実行する ○ ○  

リンク先の指定

　<a>タグでハイパーリンクを作成する場合は，「href」属性に対象となるコンテンツのURLを指定する。このURLの指定法方としていくつかの表現方法がある。

　まず，Webサーバーのホスト名やドメイン名からWebサーバーのコンテンツの配置場所まですべて指定する方法がある。

<a href="プロトコル名://ホスト名/対象ファイル">

　プロトコル名には通信を行うプロトコルを指定する。通常のWebサーバー上にあるコンテンツであれば「http」とする。また，通信がSSLにより暗号化したWebサーバー上である場合は「https」を指定する。さらに，ファイルのやりとりを行うFTPサーバー上であれば「ftp」を指定することとなる。

　ホスト名には対象となるWebサーバーのホスト名およびドメイン名，またはIPアドレスを指定する。例えば，「linux.nikkeibp.co.jp」と指定すれば，日経LinuxのWebサーバー上にあるコンテンツを示せる。

　対象となるファイルは，Webサーバーが公開しているコンテンツのディレクトリ構造にしたがったパスで表記する必要がある。例えば，日経LinuxのWebサーバーの公開ディレクトリから見てwork/document/part1.htmlファイルを指定したい場合は，以下のようにURLを指定する。

<a href="http://linux.nikkeibp.co.jp/work/document/part1.html">

URLの省略

　URLの記述は場合によって一部を省略することが可能となっている。

　まず，現在閲覧しているコンテンツと同じサーバーに存在するコンテンツを指定したい場合は、プロトコル名からホスト名までを省略することが可能だ。例えば，「http://linux.nikkeibp.co.jp/index.html」から「http://linux.nikkeibp.co.jp/document.html」ファイルにリンクを死体場合は，以下のようにホスト名までを省略できる。

<a href="document.html">

同サーバー上にあるコンテンツのパス表記

　同じサーバー上にあるコンテンツを示す場合，リンク元のコンテンツから見てリンク先のコンテンツがどこにあるかを指定する。例えば，/work/index.htmlから/work/document/part1.htmlへリンクを行う場合，/work/index.htmlから見たリンク先のコンテンツはdocumentディレクトリにあるpart1.htmlファイルであるとみなせる。この場合は以下の様にURLを指定できる。

<a href="document/part1.html">

　このようなリンク元のコンテンツから見たリンク先コンテンツの場所を示す方法を「相対パス」という。

　また，コンテンツが親ディレクトリ上に存在する場合は，「../」を利用して親ディレクトリを示すことが可能だ。例えば，/work/plan/index.htmlから/work/project.htmlへリンクを行いたい場合は以下の様に指定できる。

<a href="../project.html">

　もし，相対パスでなく，Webサーバーの公開ディレクトリの元となるディレクトリからコンテンツのURLを指定したい場合は，初めに「/」を付けて絶対パス表記にする。例えば，/work/plan/fix.htmlへリンクを行う場合は，以下のように指定すればよい。

<a href="/work/plan/fix.html">

ページ内の別の場所へのリンク

　1つのWebページが非常に長いと，途中のどこに閲覧したいコンテンツが存在するか探し辛くなってしまう。この様な場合は，ページ内にラベルを指定し，<a>タグで指定したラベルにジャンプすることが可能である。

　ラベルの指定には，ラベルをはりたい場所に<a>タグのname属性に任意の名前を指定する。たとえば，attensionというラベルをはりたい場合は以下のように記述する。

<a name="attension">注意事項</a>

　次にラベルをはりつけた場所にジャンプしたい場合は，<a>タグのhref属性にジャンプしたい対象のラベル名の前に「#」を付加してしていすればよい。上記のattensionにジャンプするリンクを作成するには，以下の様に記述すればよい。

・・・<a href="#attension">注意事項</a>をよくお読みください。・・・

　また，ほかのコンテンツ上にあるラベルを指定することも可能だ。この場合は，コンテンツのファイル名の後に「#ラベル名」と指定すればよい。例えば，index.htmlファイル上のattensionラベルにジャンプする場合は，以下のように記述する

・・・<a href="index.html#attension">注意事項</a>を参照ください。・・・

関連項目