最近ではこのような作業も優秀なフリーソフトやオンラインツールで簡単に行うことができるようになっていますが、サイトを閲覧しながら思い立った時にすぐ実行したいということもあるでしょう。
こんな時、ブラウザから素早くCSSを生成することができれば便利かもしれませんね。
Firefoxに「CSSsir」というアドオンをインストールしておけば、そんな場面でも素早くCSSジェネレータを起動し、コードを生成することができるようになります。
「CSSsir」は、Firefoxのツールバーボタンから7種のCSS3クロスブラウザコードを生成することができるようになるというアドオンです。
アドオンをインストール後ツールバーに設置されるボタンをクリックし、メニューから生成したいCSSを選択するだけで、各CSSをプレビューしながら生成することができるようになっています。
たとえば、メニューから[Text-shadow]を選択すると、以下のようなウィンドウが開くようになっています。
ここでプレビューを見ながら縦横のレンジやカラーを選択すると、下部に生成されたコードが表示されるようになっており、これをコピペして利用するようになっています。
その他に生成できるコードは以下の通りです。
■RGBA
■Text-rotation
■Transform
■Box-Shadow
■Border-radius
■Multiple Columns
■Gradient
また、[Bonus]を選択することで、各種セレクタ一覧などを参照することができるようになっています。
このように、特に複雑な知識がなくてもブラウザから簡単にCSSを生成することができるようになるというアドオンです。
かなり気軽に使うことができますので、サイト管理者の方やブログオーナーの方は、使ってみてはいかがでしょうか。
ダウンロード:CSSsir(Add-ons for Firefox)
<関連記事>
■スタイルシート(CSS)を含んだ完全なページ保存ができるFirefoxアドオン「Save Complete」
■マウスポイントした箇所のCSSプロパティを簡単に確認できるFirefoxアドオン「CSS Viewer」
■閲覧しているページのCSSをリアルタイムに編集して状態を維持できるGoogle Chromeエクステンション「Stylebot」
■Firefoxで閲覧中のWebページスタイルを自在に変更してGreasemonkeyスクリプトとして保存できるアドオン「Platypus」
■表示ページを自由自在に編集してソースを取得できるFirefoxアドオン「Edit Page」
■Firefoxに"Dreamweaver"ライクなHTMLエディタをビルトインするアドオン「Codetch」