MeasureIt

Web Information

Webページ上の要素の縦横サイズを計測できるChrome拡張機能「MeasureIt」

MeasureItはWebページ上の特定の要素の縦横サイズを簡単に計測できるGoogle Chrome拡張機能です。Web制作する人にとってはかなり役立つツールですよね。例えば、デザインを参考にしたいサイトで、ここの要素は何pxのサイズに設定されているんだろうといった時にサッと確認することができます。Chromeを使っている人は入れておいて損はない機能です。

[ads_center]

MeasureItの使い方

まずは以下からMeasureItをChromeにインストールします。

インストールすると、画面右上にMeasureItのアイコンが追加されます。

MeasureIt

サイズを測りたいサイトへ行き、このアイコンをクリックして目的の要素をドラッグすると縦横サイズを知ることができます。アイコンをクリックすると画面が半透明のような状態になり、これで計測が可能になります。

MeasureIt

測り終わったら「escキー」を押すことで半透明の状態が解除されます。(当方MacなのでWindowsは分かりません。)

1px単位まで正確に知りたい時はソースコードを確認するのが一番確実ですが、手間をかけずに大体のサイズを知りたい時には重宝する拡張機能だと思います。

関連記事

  1. タブの順番を入れ替える

    Web Information

    iPhoneのSafariで複数あるタブの順番を入れ替える(並べ替え)やり方

    iPhoneのSafariでブラウジングしているといつの間にかタブがた…

  2. Web Information

    タイポグラフィを向上させるjQueryプラグイン15

    テキストやタイポグラフィに関する機能を向上させてくれる15のjQuer…

  3. 特定のCookieを削除

    Web Information

    Chromeで特定の(個別に)webサイトのCookieを削除するやり方

    Google Chromeのブラウザで特定のwebサイトだけのCook…

  4. UI Movement

    Web Information

    さまざまUIを紹介するサイト「UI Movement」

    UI Movementはさまざまな新しいUIを紹介する便利なサイトです…

  5. CSS Dig

    Web Information

    CSSをプロパティから解析してくれるChrome拡張機能「CSS Dig」

    CSS DigというChrome拡張機能を使ってみました。今まであまり…

  6. Nexus 5でテザリングしてMacを接続

    Web Information

    Nexus 5でテザリングしてMacを接続させるやり方

    Nexus 5でテザリングしてMacを接続してみたのでそのやり方をメモ…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

最近の記事

  1. マリアージュ フレール 紅茶チョコレート
  2. CD-ADE1BK
  3. 渋谷スクランブルスクエアからの夜景
  4. BELTZのバスクチーズケーキ

アーカイブ

PAGE TOP