# アンカータグ

<a>はアンカー要素と呼ばれる。href属性を使って、別のwebページ、ファイル、メールアドレス、同じページ内の場所、または他のURLへのハイパーリンクを作成する

### href属性

hypertext referenceの略。ハイバーリンクのリンク先を指定する属性。

<a href="http://roy.e.koeki-u.ac.jp/">東北公益文科大学 学生専用サーバ</a>

- 要素
- 属性
- リンク先のファイルパス
- テキストや画像

#### 例

- テキストをクリックするとリンク先に飛ぶ
このテキストを押すとCSSを教える用のページに飛びます。
(htmlコード)

<a href="https://www.yatex.org/gitbucket/C1220118/Program-Storage/pages/css-teaching/css.html">

- 画像をクリックするとリンク先に飛ぶ
htmlコード

<a href="https://one-piece.com/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT5_y_GQUjG04b62izbowYZU8UWbZrc3Rmbai1L2FuT1YcdHSWtRF9ili2UaMANjFaQYFYeFRN1rePW8Hos7tI20vKaVZGgmf4QgtyckfQ5z84qFJt-WsgDOYXKIdrsxPyw_GddpsFXISL/s600/onepiece20_santaisyou.png" alt="One Piece"></a>

※alt属性：Webブラウザで画像が表示できないときに、画像の代わりに表示されるテキストを指定するために使われるもの。画像を使用するときは、alt=""を使おう！

- 指定メールアドレス(ここでは私の公益メールを指定）が入力されたメールソフトを開く(mailtoを使用)
お問い合わせはこちらをクリック
(htmlコード)

<a href="mailto:c122011@f.koeki-u.ac.jp">お問い合わせはこちらをクリック</a>

- クリックすると電話がかかる(telを使用)
メリーさんの電話番号(らしい)
(htmlコード)

<a href="tel:09024109679">メリーさんの電話番号らしい</a>

### target属性

リンク先を表示する場所を指定する属性。

<a href= "http://roy.e.koeki-u.ac.jp/" target="_blank"></a>

- 要素
- 属性
- リンク先のファイルパス
- 属性値

属性値 | 概要
--- | ---
_blank | 新しいウインドウまたはタブでリンク先のページを表示
_self | 初期値 現在のウインドウまたはタブでリンク先のページを表示
_parent | 親ページがある場合、親のウインドウまたはタブに表示 ない場合は_selfと同じ
_top | 親ページがある場合、最も上位の親のウインドウまたはタブに表示 ない場合は_selfと同じ

#### 例

- target="_blank"を使用
GitBucketを別タブに開くよ
(htmlコード)

<a href="https://www.yatex.org/gitbucket/" target="_blank">GitBucketを別タブに開くよ</a>

- target="_self"を使用
初期値のため、target="_self"が無くても同じ動作をするよ
(htmlコード)

<a href="https://www.yatex.org/gitbucket/" target="_self">初期値のため、target="_self"が無くても同じ動作をするよ</a>

- target="_parent"を使用
親ページがある場合、親のウインドウ・タブに表示されるよ
(htmlコード)

<a href="https://www.yatex.org/gitbucket/" target="_parent">親ページがある場合、親のウインドウ・タブに表示されるよ</a>

- taraget="_top"を使用
親ページがある場合、最も上位の親ウインドウ・タブに表示されるよ
(htmlコード)

<a href="https://www.yatex.org/gitbucket/" target="_top">親ページがある場合、最も上位の親ウインドウ・タブに表示されるよ</a>

### download属性

ユーザーがクリックしたときに、href属性で指定したファイルをダウンロードするように指定する属性

<a href="html.html" download="html.html">

- 要素
- 属性
- ダウンロードするファイルパス
- ファイル名

#### 例

- download属性を使用
これをクリックするとhtmlファイルがダウンロードされるよ
(htmlコード)

<a href="html.html" download="html.html">これをクリックするとhtmlファイルがダウンロードされるよ</a>

### rel属性・rev属性

- rel属性：リンク先との現在のぺージから見た関係性を指定する属性。
- rev属性：現在ページとのリンク先から見た関係性を指定する属性。

属性値は関係性を表すリンクタイプのキーワードで指定する。

<a href=author.html" rel(rev)=author">

- 要素
- 属性
- リンク先のファイルパス
- 関係性のキーワード

リンクタイプのキーワード | 概要
--- | ---
alternate | 代替ページ
author | 作者ページ
next | 次のページ
nofollow | 推奨していないページ
prev | 前のページ