後輩ちゃん先輩！HTMLで画像を表示させる方法を教えてください！
先輩くん了解！それじゃあHTMLで画像を表示させる時によく使われる<img>タグの使い方について解説するね！
HTML/CSSの学習におすすめ書籍
1冊ですべて身につくHTML&CSSとWebデザイン入門講座
メリット
- HTMLとCSSの基本が体系的に学べる
- Webデザインの基本が学べる
- 1つのWebサイトを作りながら学べる
ポチップ
先輩くんAmazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ！
後輩ちゃん初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね！
全プログラマー必見！
変数名/関数名にもう悩まない！
変数名/関数名にもう悩まない！
リーダブルコード
メリット
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
著:Dustin Boswell, 著:Trevor Foucher, 解説:須藤 功平, 翻訳:角 征典
¥2,640 （2023/07/23 02:48時点 | Amazon調べ）
ポチップ
目次
<img>タグの使い方
先輩くん<img>タグの基本的な書き方は以下のとおりだよ！
<img src="path/画像のファイル名" alt="代替テキスト">代替テキストとは？
代替テキストとは、表示している画像がどのような画像なのかを記述する説明文のことを指します。代替テキストを設定する理由は以下のとおりです。
- ファイル名またはパス名のスペルが間違っている時に画像の代わりに表示される
- 検索エンジンにテキストを提供して利便性を図ることができる
- 画面リーダーを使いページを読む人に対しての配慮(アクセシビリティの向上)
パス・画像名が合っている時の表示
先輩くんsrc属性に指定している画像までのパスとファイル名が合っている時の表示を確認してみましょう！
