Google chromeの便利な拡張機能の覚え書き~初心者向け 【クローム・マガジン】

サイト全体の様々な距離を測る Page Ruler

サイト全体の様々な距離を測る Page Ruler

サイト全体の様々な距離を測る Page Ruler

サイト幅から各要素の上下左右の距離など、自由に測ることができる拡張機能です。過去記事【サイトデザインにおける余白や画像のサイズを測定 MeasureIt】の上級版といったところでしょうか。サイト作成時には何かと重宝しますよ。

chrome拡張機能インストール

Page Ruler の基本的な使い方

画像のある任意のサイトを開いておきます。アドレスバー横の Page Ruler アイコンをクリック!マウスポインターが「+」になりますので、画像の大きさに合わせドラッグで選択します。上部のステータスバーにそれぞれの距離をpx単位で表示しています。

マウスポインターが「+」になりますので、画像の大きさに合わせドラッグで選択します。上部のステータスバーにそれぞれの距離をpx単位で表示

h1などの要素部分のサイズ

ステータスバーの左側にある「<>」をクリックします。それぞれの要素にポインターを合わせると要素名がステータスバーの下に表示されるのが確認できます。それと同時にステータスバーには、サイズと距離が表示。


オプション

使い方にオプションは依存してないので、お好みで!

Send Anonymous Usage Statistics:

  • 匿名での使用履歴を送信

Do Not Show Update Tab:

  • 更新タブを表示しない

オプションの説明

あとがき

他サイトを研究するのにも便利ですよ!

関連記事

最新記事


コメント


認証コード5043

コメントは管理者の承認後に表示されます。

powered by HAIK 7.0.2
based on PukiWiki 1.4.7 License is GPL. HAIK

最新の更新 RSS  Valid XHTML 1.0 Transitional