画像はWebページを彩る重要な要素です。これから解説する記述方法を真似て表示できるようになりましょう。
imgタグ
まず、画像を表示するにはimgタグ（イメージタグ）を使います。
通常のタグのように終了タグがなく、開始タグ単体で完結してしまうのが特徴です。
開始タグの中に情報を込めます。
書き方
まずは、リソースからshibainu画像をダウンロードします。
html_cssファイル内にコピペします。
html_cssファイル内は今こうなっています。
html_cssをVisual Studio Codeで開きます。
index.htmlのbodyタグ内に書いていきます。
<img src="shibainu.jpg" alt="柴犬">Live Serverを起動させ様子を見てみましょう。
すると、画像が表示されました。
属性
続いて、imgタグの中身に注目すると、「src」と「alt」というのがあります。
srcのほうはソース属性、altのほうはオルト属性といいます。
ソース属性では、画像ファイルがある場所を指定しています。
オルト属性では、画像の内容を記述しています。これは、なぜ記述しなくてはいけないかというと、画像が何らかの原因で読み込みがうまく行かなかったときに、本来表示したかった画像が何だったのかをテキストで出してあげるためです。
実際にやってみましょう。わざとファイル名を間違えてみます。
するとこのような表示になりました。
