みかおば
📘 HTML初心者のみかおばです！
今回も「ノート代わりに」記録しながら、ゆっくり覚えていきましょう〜😊
第5回は、ブログやWebページに**画像を表示する方法（imgタグ）**を解説します📷✨
💡 画像ってどうやって表示するの？
画像は、クリックじゃなく「見せる」ための要素です。
HTMLでは <img> タグを使って、写真やイラストをページに表示します！
🧩 <img>タグとは？
<img> は image（イメージ） の略。
画像を表示する専用のタグで、閉じタグがいらないのが特徴です（自己完結型タグ）。
📝 実際の書き方（コード例）
html<img src="sample.jpg" alt="サンプル画像">
src属性に画像のURLやファイル名を指定alt属性には、画像が表示されない場合の代替テキストを入れます（SEOにも有効）
👉 表示されるのは？
- 表示されるのは：「sample.jpg」の画像
- 表示されないときは：「サンプル画像」という文字が代わりに出る
🔍 よくあるミスと注意点
srcを忘れる → 画像が表示されない- ファイル名を間違える（大文字・小文字や拡張子に注意）
altを入れない → SEOやアクセシビリティに弱くなる
🪄 応用：サイズを指定するには？
html
<img src="sample.jpg" alt="サンプル画像" width="300">
width（幅）やheight（高さ）を指定すると、画像のサイズが調整できます- 基本はどちらかだけ指定すればOK！（縦横比が保たれる）
✅ 覚えておきたいポイントまとめ
<img>は閉じタグ不要の画像表示用タグsrc属性で画像の場所を指定するalt属性で代替テキストを入れる（検索対策にも◎）- サイズ調整は
widthやheightでできる
📌 次回のテーマ
👉【第6回】HTMLで箇条書きを作ってみよう（ulタグ・olタグ）📝説明文や手順を整理したいときに大活躍ですよ〜！
🔖 この回で出てきたタグ
コメント