Menu
Coddy logo textTech

画像の属性

CoddyのHTMLジャーニー「Fundamentals」セクションの一部 — レッスン 24/60。

画像を改善するための追加の属性をいくつか見ていきましょう:

  1. alt: 画像が読み込まれなかった場合に代替テキストを提供します。
  2. widthheight: ピクセル単位で画像のサイズを制御します。

例を次に示します:

<img src="img.jpg" alt="A scenic view of mountains" width="600" height="400" />

これにより、画像のソースを設定し、説明を提供し、サイズを600x400ピクセルに設定します。アクセシビリティのために常にaltを含め、デザインの一貫性を維持するために寸法を使用してください。 

challenge icon

チャレンジ

簡単

画像に次の属性を追加してください:

  1. alt: "A beautiful bird"
  2. width: "400"
  3. height: "250"

チートシート

追加の属性を使用して画像を改善します:

  • alt: 画像が読み込まれない場合に代替テキストを提供します
  • width および height: ピクセル単位で画像のサイズを制御します
<img src="img.jpg" alt="A scenic view of mountains" width="600" height="400" />

アクセシビリティのために常に alt を含め、デザインの一貫性を維持するために寸法を使用してください。

自分で試してみよう

<!DOCTYPE html>
<html>
    <body>
         <img src="https://4.img-dpreview.com/files/p/E~TS590x0~articles/3925134721/0266554465.jpeg">
    </body>
</html>
quiz icon腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

Fundamentalsのすべてのレッスン