★A / アンカー(anchor)

戻る

A / アンカー(anchor)


対応 H2 H32 H4t H4f H4s CH N2 N3 N4 N6 N7 O6 O7 ff1 NA1 GA1 MO1 K2 K3 E3 E4 E5 ME5 E55 E6 i1 i2 i3

分類

インラインエレメント

開始タグ

終了タグ

コンテント要素

インラインエレメント但しAを除く

親エレメント

インラインエレメント但しA、BUTTONを除く

共通アトリビュート

eventi18n

解説
ホームページ最大の魅力「ハイパーリンク」(ホットリンク)するための重要なエレメントです。
一般のブラウザはリンクスィッチ(リンクボタン)に指定された文字を、下線や色付きで表現します。
リンク先のパスは、絶対パス相対パスで指定します。
リンク先のファイルは、HTMLファイル以外にテキストファイル(TXT)、画像ファイル(JPEG、JPG、GIF、PNG)、ダウンロード又は実行ファイル(EXE)、ダウンロードファイル(ZIP、LZH)等があります。
アンカーネームの場合は、表示上の変化はありません。
 
オプション

対応

オプション

説    明

H4tH4fH4s

CHARSET

Charset

リンク先の文字エンコーディングを指定します。

H4tH4fH4s

TYPE

ContentType

リンク先のMIMEタイプを指定します。ブラウザが利用出来ないデータを読み込まないようにする場合に使用します。

H2H32H4tH4fH4s
CH
N2N3N4N6N7
O6O7ff1
NA1GA1MO1K2K3
E3E4E5ME5E55E6
i1i2i3

NAME

CDATA

<A HREF="#keyword">〜</A>を用いてジャンプすることにより、ページの中の指定した場所にジャンプすることができます。指定した場所にはキーワードを付けます。キーワードは後からみてもすぐにわかるようなものが良いでしょう。

<A NAME="keyword">〜</A>

HREFと同時に指定することも出来ます。

<A NAME="keyword1" HREF="keyword2">〜</A>

H2H32H4tH4fH4s
CH
N2N3N4N6N7
O6O7ff1
NA1GA1MO1K2K3
E3E4E5ME5E55E6
i1i2i3

HREF

URI

ハイパーリンク先を指定します。以下のように使用します。
<A HREF="http://www.tees.ne.jp/~pokochan/">Pokochan HTML Web Siteへ</A>

キーワードに#が付いている場合はアンカーとなり、同一ページ内にリンクします。

<A HREF="#keyword">〜</A>

他のページの特定位置へのリンクはurlにキーワードを指定します。

<A HREF="index.html#keyword">〜</A>

メールアドレスにメールを送信します。クリックするとメーラー(メールソフト)が起動します。

<A HREF="mailto:pokochan@mx1.tees.ne.jp">pokochanにメール</A>

また、?subject= を付け加えておけば、メールのsubject(件名)を入力してメーラーが起動します。

<A HREF="mailto:pokochan@mx1.tees.ne.jp?subject=mailto:のsubjectの使い方">pokochanにメール</A>

javascript:に続けてスクリプトを記述すればJavaScriptを実行することが出来ます。 使用例

<A HREF="javascript:ChangeIFrame('sub.html','sub.html')">両方ともSUB</A>

H4tH4fH4s

HREFLANG

LanguageCode

HREF属性が指定されている場合、リンク先の言語コードを指定出来ます。

H4tH4f
N2N3N4N6N7
O6O7ff1
NA1GA1MO1K2K3
E3E4E5ME5E55E6

TARGET

FrameTarget

ターゲットフレーム名を指定します。ターゲットフレーム名を指定すると指定したフレームにリンク先のページ内容を表示させることが出来ます。一度に複数のフレームを指定し内容を変えるにはJavaScriptを使用します。複数のフレームを同時変更するJavaScript参考例。

H2H32H4tH4fH4s
E3E4E5ME5E55E6

REL

LinkTypes

他文書との関係を示します。この文書から見たリンク先との関係を指定します。スペースで区切れば複数指定が出来ます。

H2H32H4tH4fH4s
E3E4E5ME5E55E6

REV

LinkTypes

他文書との関係を示します。リンク先から見たこの文書との関係を指定します。スペースで区切れば複数指定が出来ます。

H4tH4fH4s
N6N7
O7ff1
GA1MO1
E4E5ME5E55E6
i1i2i3

ACCESSKEY

Character

アクセスキーを指定します。例、E5ではACCESSKEY="y"の場合、ALTキー(Macの場合はControlキー)を押しながらyキーを押した時、O7ではShift+EscキーでアクセスキーをアクティブにしてからA〜Zのアクセスキーを押した時、このリンクにフォーカスが移動します。E4N6N7GA1MO1ではリンククリック。i1i2i3もリンククリックで、アクセスキーはキー番号(数字)。

H4tH4fH4s
O7
ME5

SHAPE

(default|rect|circle|poly)

ハイパーリンク形状を指定します。 
 default:全体
 rect:四角形(標準値)
 circle:円
 poly:多角形

H4tH4fH4s
O7
ME5

COORDS

座標

SHAPE属性で指定されたハイパーリンク形状の座標を指定します。座標値は( , )で区切って指定します。

rect:
左上のX座標 , 左上のY座標 , 右下のX座標 , 右下のY座標
circle:
中心のX座標 , 中心のY座標 , 半径  
poly:
各角のX座標Y座標の順で指定し最初と最後は同じ座標を指定して閉じます。

H4tH4fH4s
N6N7
O7ff1
NA1GA1MO1
E4E5ME5E55E6

TABINDEX

NUMBER

TABキーを押したとき、ここで指定した数値の小さい順番にフォーカスが移動します。

H4tH4fH4s
N4N6N7
O6O7ff1
NA1GA1MO1K2K3
E3E4E5ME5E55E6

CLASS

CDATA

クラス名を指定します。

H4tH4fH4s
N4N6N7
O6O7ff1
NA1GA1MO1K2K3
E3E4E5ME5E55E6

ID

ID

IDを指定します。同じ文書内で同じIDは付けられない。
リンクの対象となるアンカーネームの替わりにも使用出来ます。

<A ID="keyword">〜</A>

H4tH4fH4s
N4N6N7
O6O7ff1
NA1GA1MO1K2K3
E3E4E5ME5E55E6

STYLE

StyleSheet

CSSスタイルシートを設定します。

H2H32H4tH4fH4s
N6N7
O6O7ff1
NA1GA1MO1K2K3
E4E5ME5E55E6

TITLE

Text

リンク先の内容を設定します。 IEでは、マウスを近づけたときにバルーンでその内容が表示されます。

H4tH4fH4s
N6N7
O6O7ff1
NA1GA1MO1
E4E5ME5E55E6

onFocus

Script

JavaScriptでフォーカス獲得時に発生するイベントです。後に続く命令を実行します。

H4tH4fH4s
N6N7
O6O7ff1
NA1GA1MO1
E4E5ME5E55E6

onBlur

Script

JavaScriptでフォーカス損失時に発生するイベントです。後に続く命令を実行します。

使用例

ソース

表示&操作

<A HREF="#URI" ACCESSKEY="y">URIへ</A>
<A HREF="reference1.html" REL="Index" TARGET="_blank">インデックスへ</A>
と記述すると

URIへ インデックスへと表示されます。

オプションに<A ID="ID1">オプション</A>と記述して、
<A HREF="#ID1">オプションへ</A>と記述すると

オプションへでジャンプ出来ます。


Aエレメントでもクリッカブルマップのハイパーリンク形状および座標(クリック領域)を指定出来ます。MAPエレメントを参照して下さい。対応ブラウザは、現在のところME5O7のみですが。。。
注意点
見出しにアンカーネームを埋めこむ時には注意しましょう。

×<A NAME="keyword"><H1>見だし</H1></A>
△<H1><A NAME="keyword"></A>見だし</H1>
○<H1><A NAME="keyword">見だし</A></H1>

改行、スペースを入れるとアンダーラインがはみ出てしまうので注意しましょう。

×<A HREF="xxyy.zip">
ダウンロード
</A>
○<A HREF="xxyy.zip">ダウンロード</A>

参考
リンクの下線を消すにはスタイルシートtext-decoration を使います。

<STYLE TYPE="text/css">
<!--
A { text-decoration:none; }
-->
</STYLE>


Copyright (C) pokochan 2000-2005
http://www.tees.ne.jp/~pokochan/html/a.html
E-mailpokochan@mx1.tees.ne.jp