【HTML】リンクを埋め込む
連続でHTMLのアウトプットをしていきます。
HTMLにリンクを埋め込む(その1)
HTMLで下記のようにリンクを埋め込むにはaタグとhrefを使う。
yskmtg’s blogはこちら
aタグ:「anchor(アンカー)」の略
href: 「hypertext reference」の略で、直訳すると「ハイパーテキストの参照」。 hrefとはa(アンカー)タグの属性の一つで、いくつかあるaタグの属性の中でも一番重要なもの!主にhrefでリンク先の場所を指定することが役割になっている。
<a href="URL">yskmtg's blog</a>
同じタブで開くのではなく、違う新しいタブでページを開きたいときは、target属性の値を使う。
target属性の値を_blank
にする。
<a href="URL" target="_blank">yskmtg's blog</a>
こうすることで別のタブにリンク先を表示してくれて便利!
HTMLにリンクを埋め込む(その2)
次に同じページ内にリンクを飛ばす方法。 例えば「このサービスについて」の見出しにリンクをつけて、同ページ内の「このサービスについて」の説明場所に飛ばせたい。
- リンクを貼る側は、herf属性と「#(パウンド記号)をつけて、その後に好きな識別子をつける」
<a href="#about">このサービスについて</a>
- このサービスについて」の説明場所にはidを貼り付ける
<h2 id = "about">このサービスについて</h2> <p>このサービスについての説明このサービスについての説明このサービスについての説明このサービスについての説明このサービスについての説明</p>
HTMLにリンクを埋め込む(その3)
最後に同じページ内で一番上に戻る方法。
ページの先頭に戻るには、href属性を単に#
とするか#top
と書いてあげるとリンクをつけられる。
<p><a href= "#top">先頭に戻る</p>