IT専科TOP>HTML/スタイルシート>HTMLタグ(ABC順)> <a>

<a>

Anchor(アンカー)と呼ばれるもので、ページへのリンクやname属性で指定した場所に遷移することができます。


ブラウザ

IE3 / IE4 / IE5 / IE5.5 / IE6 / N3 / N4 / N6 / N7 / O6 /O7 /O9 /Fx1 /Fx2 / IE5 mac

▲PageTop

仕様

・構成
要素区分 エンドタグ ネストできる要素 備考
インライン 省略不可 inline から<a>要素を除いた要素

・属性
属性名 必須 意味
href リンク先URL URL
charset リンク先の文字コード 例:Shift_Jis
hreflang リンク先の言語コード 例(日本語):ja
type リンク先の文書タイプ 例:text/html
name 識別名 任意のテキスト
rel 現在のページとリンク先との関係
alternate
lang属性と併用でその文書が翻訳されたページであることを示しますまたmedia属性と併用すると、別メディアのページであることを示す
stylesheet
外部に作成されたスタイルシートであることを示すalternateを併用するとユーザーごとのスタイルシートを設定することができる
start
検索ロボットに対して、作者が最初に見てほしいと思う文書を示す
next
次の文書であることを示す
prev
前の文書であることを示す
contents
目次であることを示す
index
索引であることを示す
glossary
その文書に関係する用語集であることを示す
copyright
著作権表示であることを示す
chapter
章を示す
section
節を示す
subsection
小節を示す
appendix
附属した文書であることを示す
help
詳細な説明が書かれた文書(他サイト含む)であることを示す
bookmark
ブックマークであることを示すブックマークとは、長い文書の中のある重要な入り口に対して設定されたリンクである
rev リンク先と現在のページとの関係 relと同様
shape イメージマップの形状
default
全体
rect
四角(規定値)
circle
poly
多角形
coords イメージマップの領域の座標
rect
左端のx座標,上端のy座標,右端のx座標,下端のy座標
circle
円の中心のx座標,円の中心のy座標,半径
poly
頂点ごとのx,y座標
※ ただし、始まりと終わりの点の座標は同一にすること
tabindex Tabボタンで選択できる順番 数値
accesskey 任意のキー 例:k
target 表示先名
_blank
新しいウィンドウで開く
_self
ハイパーリンクを貼り付けたフレームで読み込む
_parent
現在のフレームの上位フレームで読み込む上位フレームが無い場合は_selfと同様
_top
フレーム分割を解除し、ウィンドウ全体で読み込む親フレームが無い場合は_selfと同様
class class名 スタイルシートを設定したclass名
id id名 スタイルシートを設定したid名もしくは、任意のテキスト
title 説明文 任意のテキスト
style スタイル 任意のスタイル
lang 言語コード 例(日本語):ja
dir 右読み・左読み
ltr
左から右に読む
rtl
右から左に読む

・イベント
イベント 仕様
onfocus フォーカスが合ったとき発生
onblur フォーカスが外れたとき発生

▲PageTop

サンプル

ソースコード

<html>
  <head>
    <title>サンプルコード</title>
  </head>
  <body>
    1 リンクする<br>
    <a href="../../../../"charset="shift_jis" hreflang="ja" type="text/html" rel="start" rev="section">
    homeへジャンプ
    </a><br>
    <br>
    2 識別名を付ける<br>
    <a name="namae">識別名:namaeをつけてます</a><br>
    <br>
    3 識別名をつけた場所にジャンプする<br>
    <a href="#namae">識別名:namaeへジャンプ</a><br>
    <br>
    4 マウスが重なったとき説明を表示する<br>
    <a href="../../../../" title="ここをクリックするとhomeへジャンプします">home</a>
    <br>
    <br>
    5 id属性によるジャンプ<br>
    <a href="#wrapper" title="このページの上位にid属性でwrapperが指定してあります">このページの先頭にジャンプ</a>
    <br><br>
    6 メールソフトを起動
    <address>
    問い合わせ先<br>
    <a href="mailto:hogehoge@itsenka.com?subject=IT%90%ea%89%c8%83T%83%93%83v%83%8b%96%e2%8d%87%82%b9">aaa@bbb.ccc</a>
    </address>
    </body>
    </html>

表示結果

1 リンクする
homeへジャンプ

2 識別名を付ける
識別名:namaeをつけてます

3 識別名をつけた場所にジャンプする
識別名:namaeへジャンプ

4 マウスが重なったとき説明を表示する
home

5 id属性によるジャンプ)
このページの先頭にジャンプ

6 メールソフトを起動
問い合わせ先
hogehoge@itsenka.com

▲PageTop

関連項目

HTML

<address> / <map>


CSS

link / visited / hover / active


▲PageTop