HTML 画像にリンクをつける方法

こんなあなたにおすすめ

・HTMLで画像にリンクつける方法を知りたい

HTMLで画像にリンクをつけたいけどどうしたらいいのという方がいらっしゃるのではないでしょうか。

今回は、HTMLで画像にリンクをつける方法について解説します。

HTMLで画像にリンクをつける方法

imgタグをaタグで囲むだけで、簡単に画像にリンクをつけることができます。

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>画像にリンクをつける</title>
  </head>
<body>
  <a href="https://w-workblog.com" target="_blank"><img src="img/Sample.jpg" height="200" width="200" alt="Sample img">←画像をクリックでリンク先に移動</a>
</body>
</html>

実際に以下の画像でお試しできます。

画像は新規タブで開くようになっています。
方法については、以下の記事をご参照ください。
>>HTML リンクを新規タブで開く方法 target=”_blank”

まとめ

ここまで、HTMLが画像にリンクをつける方法について解説しました。

imgタグをaタグで囲むだけですのでとっても簡単です。

本で学習したい方には、以下の参考書がおすすめです。
>>スラスラわかるHTML&CSSのきほん

エンジニアを目指すなら、TechAcademy!
オンラインスクール受講者数No.1!

・自宅にいながらオンライン完結で勉強できる
➡スクールへの移動時間を削減するため、効率的に学習可能!

・受講生に1人ずつ現役のプロのパーソナルメンターがつく
➡分からないことがわかるまで徹底的にメンターに質問可能!

・チャットで質問すればすぐに回答が返ってくる
➡レスポンスが速いから、わからないことをその場で解決!

・オリジナルサービスやオリジナルアプリなどの開発までサポート
➡就職、転職のときに役立つポートフォリオを開発可能!

無料で体験できるので、まずはお試し
>>TechAcademyの無料体験はこちら

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です