画像の表示

日　時：2022年12月18日 13:30から16:00

参加者：小野大関大野青木池田藤本

内　容：画像の表示を学習した。
画像の挿入は次のように記述します。
<img src="画像URI" alt="代替テキスト" width="幅" height="高さ" />
幅と高さをピクセルで指定する場合単位ピクセルは不要です。
widthとheightは必須の属性ではないため省略された場合は元画像のサイズが適用されます。
width又はheightのみを指定した場合は元画像の縦横比に応じて表示されます。
img要素はインライン要素なので続けて記載するとサイス幅に余裕のある場合は横並びで表示されます。

実習

前回作成した「it.html」の「ホームページとは」「Webブラウザとは」「HTMLとは」の説明文の直下に該当する画像を挿入し、idで指定した場所へリンクがかかっていることを確認した。
「zoo.html」にライオン画像とペンギン画像を挿入し、widthとheightを指定して挙動を確認した。
head部分にstyle要素で画像への枠線挿入を指定した。
img {border: 5px #0ff solid;}