HOME >> HTML > 画像のサイズを指定する

point 画像のサイズを指定する

<IMG src="URL(画像のアドレス)" width="横幅" height="高さ">
画像のサイズを指定するには、width属性とheight属性を使います。width属性で横幅を指定し、height属性で高さを指定します。ピクセル値もしくは画面に対する割合(%)でそれぞれの大きさを決めます。ただし%で指定した場合、画像のバランスが崩れたりしますし、Netscpe Navigator4.7では上手く画像が表示されませんので、ピクセル値で指定することをお薦めします。

また、サイズを指定しなくても画像は表示されますが、サイズを指定するとブラウザの読み込みのスピードが多少速くなるので、必ず指定するようにしましょう。それと、何らかのトラブルで画像が表示されない時、サイズを指定しておけばその分のスペースが確保されますので、レイアウトが崩れるのを防ぐことが出来ます。

注意点として、元の画像と比べてサイズを大きくしすぎると、画像が粗くなってギザギザが表示されてしまいす。それと、width属性とheight属性を使って、もとの画像の表示サイズを小さく出来ますが、ファイルサイズ(200kbとか)は変わりません。画像編集ソフトを使って画像のサイズを小さくすれば、ファイルサイズも小さくなるので、こちらの方法のほうがお薦めです。ファイルサイズが小さくなると、そのぶん軽いページになりますしね。

サンプル - Microsoft Internet Explorer
ホーム(H)メニュー(M)戻る(B)進む(N)

ソース
<HTML>
<HEAD>
<TITLE>サンプル</TITLE>
</HEAD>
<BODY>
<IMG src="reo.gif" width="100" height="100">
<BR>
<IMG src="reo.gif" width="50" height="50">
</BODY>
</HTML>
スポンサード・リンク
Copyright ©2001〜2016 まさぼ〜 All Right Reserved