スポンサーサイト

ブログ移転しました

新URL→ http://4th-life.com
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

ブログ移転しました

新URL→ http://4th-life.com
このエントリーをはてなブックマークに追加 この記事に拍手する

Tag:スポンサー広告 

ColorZillaの使い方

ブログ移転しました

新URL→ http://4th-life.com
FirefoxのアドオンColorZilla
WEB上で表示しているサイトで使われている色を
ピンポイントで知ることができます。

まずはインストールから。

CollorZillaダウンロードページ

使い方はとても簡単。
特に設定はいりません。

ブラウザ画面の左下のCollorZillaのアイコンをクリックすると、
マウスポインタが十字に変わるので、
調べたい部分に合わせるだけ。

左下のアイコンの右側にカラーコードが出ます。

colorzilla-1

調べたい部分でクリックすると色情報が保存され、
アイコンが元に戻ります。
その後、アイコンをダブルクリックすると
保存した色情報が表示されたカラーピッカーが開きます。

colorzilla-2


アイコンの横をクリックすると、メニューが出ます。
コピーをクリックするとコードをコピペできます。

colorzilla-3


Webpage DOM Color Analyzerをクリックすると、
表示しているページの色情報がすべて出てきます。

colorzilla-4



オプションでちょっとだけ設定を変更します。

colorzilla-5

・スポイト使用時に通常のカーソルを使用
・・・十字のカーソルではなくて通常の矢印のカーソルで使用する。
   十字のカーソル方がやりやすいので外しておきましょう。

・カーソルが重なったタグにアウトラインを表示
・・・カーソルが重なっているタグに点線のアウトラインができます。
   うっとうしかったら外しましょう。

・コンテキストメニューに表示
・・・右クリックした際に出てくるメニューにCollorZillaが表示されます。
   アイコンをクリックすればすぐに使えるので
   右クリックからColorZillaを呼び出さないなら外しましょう。

・16進数の値を小文字で表示
・・・カラーコードを小文字で表示します。
   HTMLに貼り付ける際には小文字でコピーできた方がいいので、
   チェック入れときましょう。


アイコンも左下にできて邪魔にならないし、
これはいれておくべきですね。

ブログ移転しました

新URL→ http://4th-life.com
このエントリーをはてなブックマークに追加 この記事に拍手する

Tag:トップ  Trackback:0 comment:0 

Comment

comment form
(編集・削除用):
管理者にだけ表示を許可
プロフィール

名前・inacaster
職業・SOHO(在宅ライター)
ジャンル・WEB関係全般
人種・関西人
年齢・華の1981年生まれ

カテゴリー
スポンサードリンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。