CSSの編集のお供をしてくれる虫

カテゴリー :Firefox

WordPressのテーマの編集を行いました.CSSの編集が直接行えるのは便利ですね.

当分このテーマのままでいこうと思ってるんですがちょっと日本語で運用するとなると不格好な点がいくつかあったので修正してみました.

参考サイト

WordPress Codex 日本語版

具体的には

  • フォントの変更
  • フォントサイズの変更
  • サマリーの調整
  • etc

としたのですがスクリーンショットみせても面白く無いと思うので使った要素の調査に使ったアドオンをご紹介

Firebug :: Add-ons for Firefox – Mozilla Add-ons

201402010153486078

リンク見てもらえばわかると思いますがfirefoxのアドオンです.

今回はこのアドオンの基本的な機能を使って編集を行いました.

このアドオンを導入するとfirefoxのアドオンバー(下のバー)にこのようなアイコンが増えます.

201402010017076066

こいつをクリックでfiregug起動!

201402010151466073

firefoxの下にこのようなツールが展開されます.

あとは調査したい要素を右クリックして「Firebugで要素を調査」を選択するのみです.

するとで囲んだところに適応されているスタイルが表示されます.

このスタイルの各値は一時的に上書きが可能で値をダブルクリックすると入力を受け付けてくれるのでどんな感じになるかなーってのを試すことができます.

決定案ができたらWordPressに反映して終わりです.

このアドオンは他にもスプリクト書くときにも便利だったりするのでまたそのうち紹介します.

 

CSSを勉強して思い通りのサイト作りを!