MB-Support

パソコン初心者のサポートページ

画像のサイズを確認する方法

 ホームページに画像を掲載する時に width と height で指定する画像サイズを調べる方法


ホームページに画像を挿入する方法は、以下のページに掲載しています。



画像を表示する方法 - ホームページの作り方

画像を挿入するタグは、 <img src="" /> ですが、このタグ内に画像サイズを指定すると、ページ全体の表示速度を向上させる事ができます。 もちろん、今の主流な通信回線とコンピュータの処理能力ではそれほど違いを体感する事は不可能かも知れませんが、ページに表示させる画像が多かったり、テーブル内に画像を挿入したり、または、サイト全体のパフォーマンスを考慮した場合、サイズを指定するメリットは気がつかないまでも確実に有ると思います(以下赤い文字の部分)。

HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<img src="画像のアドレス" width="244" height="77">
</body>
</html>


ホームページを制作する市販のソフトウェアを利用すると、画像サイズは自動で入力されたり、入力されなくても右クリックでプロパティを表示して、サイズの指定はもちろん、変更や Alt テキストまで簡単に入力できる様になっています。 しかし、ビルダー系のソフトウェアを利用せず、手書きでホームページを制作する場合は、画像ファイルのサイズを知る必要があります。サイズが分らなければソースで指定できませんから・・・



例えば、右の例ではホームページに「sdfsdfd.JPG」と名前の付いた jpeg 画像を表示するとします。 この画像のサイズを知る方法は・・・



画像ファイルのアイコンにカーソルを移動します。アイコンにカーソルが重なれば、そのファイルの簡易情報が表示されます。

ここで必要な情報は「サイズ」となり、右の例では「120(width)× 104(height)」となります。これによりタグに挿入するサイズは以下。

<img src="sdfsdfd.JPG" width="120" height="104" />


上の方法でホームページを制作するには十分かと思われますが、カーソルを乗せている間だけしか表示されません。 これをプロパティで表示させるには、アイコンにカーソルを移動して右クリックします。 表示されたメニューの「プロパティ」を左クリックします。



プロパティにファイルの位置や容量などの詳細情報が表示されますが、必要なのは上部の「詳細」タブを左クリックして、下に表示される幅と高さです。



他に、画像を Windows に付属するペイントで起動して、「変更」→「キャンパスの色とサイズ(A)」を左クリックしてもサイズを確認できます。 この場合、単位をピクセルに指定すれば、そのままホームページのソースに入力できます。


HTMLソース(メモ帳)

<html>
<head>
<title>題名</title>
</head>
<body>
<img src="sdfsdfd.JPG" width="120" height="104" />
</body>
</html>

ブラウザ




戻る 一覧表示 次へ


Copyright © 2018 MB-Support パソコン初心者のサポートページ All Rights Reserved.

管理人サイト閲覧方法プライバシーポリシー著作権/免責事項