画像の大きさを調べる

Photoshop

Photoshopで画像の大きさを調べる

 Windows Photoshop6.0

Adobe Photoshopを使用して、写真やイラストの画像の大きさを調べることができます。

  • ツールボックスから「自動選択ツール」を選択し、確認したい画像を選択します。選択範囲を変えたいときは、ツールボックスから「選択範囲」→「選択範囲を反転」を選択します。

&ref(toolbox.GIF); &ref(asiato.GIF);

  • 情報パレットの右下に「W:6.95」「H:2.19」等、選択した画像の大きさが表示されます。

&ref(palette.GIF);

  • 大きさの単位を変えたいときは情報パレット右上にある「▶」をクリック→「パレットオプション」をクリック→「定規単位」を変える

&ref(option.GIF);

画像の合成(UIView編)

iPhone

画像を合成したいときの手段は、いくつかあります。
その一つは、UIViewのスクリーンショットを撮って合成するというものです。
画面の見たままを保存します。

mergeView = 【UIView】;

//Creates a bitmap-based graphics context and makes it the current context.
 UIGraphicsBeginImageContext( mergeView.bounds.size );

//Screen Capture
 [mergeView.layer renderInContext:UIGraphicsGetCurrentContext()];

//Returns an image based on the contents of the current bitmap-based graphics context.
 UIImage *mergedImage = UIGraphicsGetImageFromCurrentImageContext();
 UIGraphicsEndImageContext();

画像の中での位置を把握する

Photoshop

画像の中のある部分の位置を調べる

写真やイラストを加工するとき、今操作している位置が画像のどのあたりになるのか、把握したい時があると思います。
筆者は、HTMLのクリッカブルマップなどを直す時に使います。
クリッカブルマップを作るツールをいちいち立ち上げるのが面倒なので。

  1. 画像を開きます。
  2. ナビゲータ・情報というタブのある、小さいウィンドウは表示されてますか?表示されてなければ、上部メニューのウィンドウ→情報を表示をクリックします。
  3. その情報タブをクリックします。
  4. 左下にX,とかY、とか書いてあります。カーソルを動かすと、その数値が増えたり減ったりします。Xが横方向、Yが縦方向です。
  5. 単位がcmやピクセルになってますが、指定したい場合は、上部の「編集」メニュー→「環境設定」→「単位・定規」をクリック。
  6. 定規の単位をpixelやcmなど好きな単位にしましょう。

続き→画像の一部分の大きさを把握する

画像の一部分の大きさを把握する

画像の中の一部分の大きさを調べる

画像の中での位置を把握するで、情報ウィンドウが表示されていると思います。
次は、ある画像の、特定の部分のサイズを調べたい場合です。

  1. 画像の中で選択ツールをクリック
  2. 画像を選択
  3. 情報ウィンドウの右下に、W,H、と書いてあるところに数字が出ます。それが、選択した部分の大きさです。Wが横幅で、Hが縦幅です。

画像のすき間が空いてしまう

Webサイト作成 トラブル
css

ホームページ作成時、画像と画像をつめて表示したいのに、すきまが空いてしまう。

Web作成

 <img>タグと次の<img>タグの間にスペースや改行が入っていませんか?
 それらを消してみましょう。

 InternetExplolerだとすき間無く表示されるのに、他のブラウザ(FireFoxなど)だと空いてしまう。

Photoshopなどの画像ソフトなどでWebを作る時、画像ソフトがHTMLを出力してくれる便利な機能がありますが、Table(表形式)で出力されると、IE以外だと画像とtableの間にすき間が空いてしまうことがあります。
次の二つの方法で治りますが、最良の方法かどうか分かりません。

  • imgのスタイルをdesplay:block;などとして、ブロック要素に指定する
  • スタイルのvertical-align:bottomなどで、下詰めにする
  • DOCTYPEの宣言を互換モードに変えてしまう。(逃げ?)

また、全角のスペースなどが入っていることもあります。
Dreamweaverだと発見できないので、このせいだと発見が遅れてしまいますね。テキストエディタなどでHTMLソースを見てみましょう。

  • Photoshopから画像とHTMLを作成したところ、IE7だけ画像の間に隙間があいてしまい、困ってました。imgのスタイルをdesplay:block;にして確かに治りました。 — 名無し {2008-03-16 (日) 17:01:01}