HTMLで画像にリンクを張る

a要素を使いimg要素を囲みます

HTML文書を記述していて、画像にハイパーリンクを設定したい場合は以下の手順を踏みます。

  • ハイパーリンクを設定したい画像のimg要素をa要素で囲みます。
  • a要素のhref属性値に、リンク先となるURIを設定します。

例えば、以下の画像があるとします。

HTML
<p>
<img src="https://taghtml.com/sasaelle_banner.gif" alt="ササエルのバナー" width="120" height="45" />
</p>

この画像にリンクを貼りを貼りたい場合は、href属性付きのa要素で囲みます。
画像をクリックすることで指定先にジャンプすることが可能になります。

HTML
<p>
  <a href="http://sasaelle.com">
  <img src="https://taghtml.com/sasaelle_banner.gif" alt="ササエルのバナー" width="120" height="45" />
  </a>
</p>

ササエルのバナー

※ バナー(banner)とは他のウェブページにリンクする広告・宣伝用の画像のこと。