HTML Webサイトに写真を追加する方法

あなたのウェブサイトのページに写真を追加すると、多くの場合、テキストを使用するよりも見やすくなり、情報を伝えることができます。 このプロセスは、HTMLコードと画像ファイルを使用して行われます。 ファイルは別のWebページからのものでも、Webサーバーに格納されたものでもかまいません。

を使う タグ

WebページのHTMLコードでは、を使用して画像を追加できます。 タグ。 の中に タグは、4つの属性を指定する必要があります。

  • Src - source属性は画像の場所を示します。 イメージがサイトと同じサーバー上にある場合は相対パスを使用できますが、別のサイトからのイメージには絶対パスが必要です。
  • Alt - 代替テキスト属性は画像の説明文です。
  • - 画像の幅です。
  • 高さ - 画像の高さ。

オプションの属性はBorderです 。これを使用すると、画像の周囲に境界線を指定できます。 境界線属性はピクセルサイズで定義されます。 たとえば、次のようにしてborder = 1を使用します。 tagは、画像の周囲の幅が1ピクセルになることを意味します。

注:Border属性はHTML 5では推奨されておらず、サポートされていません。

次の例は、このページの上部に画像を追加するために使用される実際のHTMLを示しています。 それらはあなたのページの本文のどこにでも挿入することができます。 最初の画像はURLが短くなっています。これは、画像がサーバーに保存されているためです。 二つ目は、あなたが私たちのイメージにどのようにリンクするかです。

例1

例2

Webページで使用できる画像形式は何ですか?

写真、写真、ロゴ、およびその他の画像に使用する最も一般的な画像形式は、JPEG、GIF、およびPNGです。 BMPなど、広くサポートされていない他の画像形式は、すべてのブラウザで機能するとは限りません。

imgタグ内の属性を引用符で囲む必要がありますか?

はい。 今日のブラウザは通常、属性値を囲む引用符が欠けているエラーを修正できますが、エラーを防ぐために属性値を囲む引用符を常に使用する必要があります。