テキストや画像などにリンクを設定するa要素
<a>……</a>
a要素は「anchor」の略で、テキストや画像などにリンクを設定する際に使います。インライン要素として機能し、a要素を除くインライン要素・テキストを内包できます。
「こちら」など意味を持たないテキストをa要素に設定するのは好ましくなく、「トップページへ」など具体的なテキストを記述する必要があります。
例
<html>
<head>
<title>a要素のサンプル</title>
</head>
<body>
<p><a href="http://example.com">exampleについて</a></p>
</body>
</html>
DOMでの参照方法
[window.]document.getElementById("【ID属性値名】")
[window.]document.links[i]
[window.]document.anchors[i]
オプション属性
属性 | 値 | 機能 | 入力例 | DOM参照 |
---|---|---|---|---|
charset | 文字コード名 | リンク先の 文字コード を指定 |
<a charset="utf-8" href="example.html">……</a> |
− |
coords | 座標の数値 | イメージマップ の範囲を指定 |
<a shape="rect" coords="10,10,50,50" href="example.html">……</a> |
− |
href | URI | リソースの 所在を指定 |
<a href="example.html">……</a> |
[window.]document.getElementById("【ID属性値名】").href |
hreflang | 言語コード | リンク先の 言語コード を指定 |
<a hreflang="ja" href="example.html">……</a> |
− |
name | アンカー名 | ほかのページ からのリンク先 となるための アンカーに 名前を指定 |
<a name="sample">……</a> |
[window.]document.getElementById("【ID属性値名】").name |
rel | "alternate" "appendix" "bookmark" "contents" "copyright" "glossary" "help" "index" "next" "prev" "start" "chapter" "section" "subsection" |
現在のページ から見た リンク先との 関係性を指定 |
<a rel="next" href="example.html">……</a> |
[window.]document.getElementById("【ID属性値名】").rel |
rev | "alternate" "appendix" "bookmark" "contents" "copyright" "glossary" "help" "index" "next" "prev" "start" "chapter" "section" "subsection" |
リンク先 から見た 現在のページ との関係性 を指定 |
<a rev="prev" href="example.html">……</a> |
[window.]document.getElementById("【ID属性値名】").rev |
shape | "defalut" "rect" "circle" "poly" |
イメージマップ の形状を 指定 |
<a shape="rect" coords="10,10,50,50" href="example.html">……</a> |
− |
target (非推奨属性) |
"_blank" "_self" "_parent" "_top" または、任意の フレーム名 |
リンク先を 表示する 方法を指定 |
<a target="_blank" href="example.html">……</a> |
[window.]document.getElementById("【ID属性値名】").target |
type | MIMEタイプ | リンク先の リソースの MIMEタイプ を指定 |
<a type="text/html" href="example.html">……</a> |
− |
追加が可能なイベントハンドラ属性
onclick、ondblclick、onmousedown、onmouseup、onmouseover、onmousemove、onmouseout、onkeypress、onkeydown、onkeyup
有限会社タグパンダ
喜安 亮介
2/5 |
INDEX | ||
Web標準HTMLタグリファレンス(5) リンクやファイル同士の関係を表す4つのXHTMLタグ リンク |
||
a テキストや画像などにリンクを設定するa要素 | ||
link ほかの文書との関係性を定義するlink要素 | ||
script スクリプトを文書内に読み込む際に使うscript要素 | ||
noscript スクリプトが実行不可能な際に代替内容を表示するnoscript要素 |
HTML5 + UX フォーラム 新着記事
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 (2017/7/12)
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET/POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 (2017/7/10)
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文&ループ脱出のbreak/スキップのcontinue【更新】 (2017/6/26)
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート (2017/6/12)
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
|
|