chromeデベロッパー・ツールでローカルファイルに直接保存しながらCSSコーディングする方法 を読んで、「それ Firefox でもできるよ」と思ったので。
スタイルエディタ
Firefox の開発ツールには「スタイルエディタ」という機能があります。CSS をここで編集すると、変更がダイレクトに反映されます。
スタイルファイルの編集
Chrome はいろいろ設定しなくてはいけないようですが、Firefox ではスタイルエディタに表示されているファイルのリストから、編集するファイルを選ぶだけで編集できるようになります。
前述した通り、編集内容はすぐに表示結果へ反映されるので、効果を目で確認しながら編集ができます。
保存は、ファイル名前の横に「保存」と書かれたリンクがあるので、それをクリックします。
スタイルファイルの新規作成
また既存のスタイルだけでなく、新規にファイルを作成することもできます。手順は以下の通りです：
- ツールバーに「新規作成」ボタンがあるので、それを押します。
- スタイルを書きます
- 「保存」をクリックして、保存先を選び、保存されます
調整するなら Firefox
Chrome の開発ツールも素晴らしいですが、結果を確認しながらページを調整するなら Firefox の方が便利だと感じています。選択肢の一つに加われば幸いです。