問題
5heightとwidthで画像サイズを指定しよう
heightとwidthとは、そのままの意味で横幅（width）と高さ（height）を指定するために用意されたHTMLの属性です。heightとwidthはCSSで扱うイメージを持っていると思いますが、HTMLでも、表やフレーム、画像などを調整するための属性として用意されています。
HTMLの問題に挑戦しよう！
問題
「heightとwidthで画像サイズを指定しよう」
heightとwidthを使用して表示する画像のサイズを指定しましょう。
縦幅を600、横幅を1000で指定してください。
あらかじめエディタに書くコード
<img src="https://ninjacode.work/assets/img/kv.png" alt="忍者CODEの画像">
¥HTML¥
期待する画面
解答と解説（heightとwidthで画像サイズを指定しよう）
解説
※ご登録後トークルーム下部にあるメニュー内
「無料問題集※解答付き」を押すと
解答閲覧用URLが届きます
widthは画像の横幅を指定し、heightは画像の高さを指定します。
単位は省略されますが、実際には、「px」と同様の表示サイズで指定されます。
今回はwidthの値を1000、heightの値を600で設定すればOKです。
補足
画像のサイズを指定する場合は縦横比率を考えて指定するようにしましょう。
縦横比率を無視して画像サイズを指定すると画像は粗く表示されたり歪んでしまうことがあります。
数値の設定には注意しましょう。
画像サイズの指定に悩んだ場合は、どちらか片方だけを指定しましょう。
widthとheightどちらか片方のみ指定した場合は自動的に縦横比率を
考慮したなりゆきのサイズになります。コチラは活用できそうですね!
ポイント
height属性、width属性とは
height属性は、主に画像などの高さを設定するのために用意されたHTMLのタグです。いくつかの要素に使用することができる属性ですが、非推奨とされている要素が多いため、imgタグを中心に使用すればOKです。
wdth属性は要素の幅を設定するために使用される属性です。
指定するには、どちらも属性値にpxや%などの単位を使って指定します。
