画像をHTMLに挿入 - hiyoko-programingの日記

上記の例で考える。

◉ src 属性

<img> タグでは、src 属性をつけて、

埋め込み画像ファイル（フォルダ／ファイル名）があることを示す。

◉ alt 属性

alt 属性には画像の代替テキストを入力する。

これは、主に、

スクリーンリーダー（目が不自由な方のための音声読み上げソフト）や、

画像をうまく表示しないブラウザで利用される。

なので、

うまく表示しなかったブラウザでもalt 属性値に置き換わることで

意味が変わらないように記入しておく必要がある。

ただし、補足する内容がない場合は、

「 alt="" 」と空にしておくことも可能。

alt 属性は必須項目なので、必要がなくても省略は出来ない。

空の値「 alt="" 」を必ず記入する！！！

◉ width / height 属性

width 属性は画像の幅、

height 属性は画像の高さを入力する。

画像の実際のサイズと等しい値を入力する。

もし、異なるサイズの値を入力すると、

画像が拡大・縮小されて表示されてしまう。

画像が伸びたり、潰れたりしてしまうので注意が必要。

なお、width / height 属性は必須ではないので、

省略しても構わない。

省略すると、画像の実寸が表示される。