HTMLで画像をリンクする方法

HTML では、<img> タグを使用して Web ページに画像を表示できます。また、リンクを通じてインターネット上の画像を参照することもできます。この記事では、HTMLで画像をリンクする方法を詳しく紹介します。

最初のステップは、リンクする画像がどこにあるかを知ることです。一般に、ピクチャは、ローカル ピクチャとネットワーク ピクチャの 2 つのカテゴリに分類できます。ローカル画像は自分のコンピュータに保存されている画像であり、ネットワーク画像はインターネット上に保存されている画像であり、リンクを通じてアクセスする必要があります。

ローカル イメージの場合、src 属性を <img> タグに追加して、イメージが保存されるパスとファイル名を指定する必要があります。例:

<img src="images/myimage.jpg" alt="My Image">

ここで、src 属性の images/myimage.jpg は、「images」という名前のフォルダーに保存されている画像を指します。「myimage」という名前の画像.jpg」。同時に、alt 属性を使用して画像の代替テキストを指定することもできます。代替テキストは主に次の 2 つの場合に使用されます。

1. 画像が読み込めない場合に代替テキストが表示されます。
2. スクリーン リーダーなどの補助ツールを使用する場合、画像を置き換える代替テキスト

src## として使用できます。 #<img> タグ #属性の値。例:

<img src="https://example.com/images/myimage.jpg" alt="My Image">

https://example.com/images/myimage.jpg は、次の場所に保存されているファイルを指します。 " Web サイト https://example.com からの "myimage.jpg" という名前の画像。 リンクを使用して画像を参照する場合、<img>

src 属性にリンクの URL アドレスを追加する必要があります。例:

<img src="https://example.com/images/myimage.jpg" alt="My Image">

タグの href 属性を画像のリンク アドレスに設定し、その中に <img> タグを挿入します。画像を表示するためのタグです。例:

  <img src="https://example.com/images/myimage.jpg" alt="My Image">

タグで囲まれている点を除いて、前の例と同じです。 。ユーザーが画像をクリックすると、href 属性で指定されたリンクに自動的にジャンプします。この方法は、「画像をクリックするとリンクに入る」という効果を演出する場合に非常に便利です。 要約すると、HTML でリンクを使用して画像を参照する手順は次のとおりです。