vii.cx

少し触りました！
細かなバグフィクスとアイコンを少々変更、 その他、新しいセレクタを作る際のダイアログの挙動を少し変更、 あとは、セレクタを任意の個所に挿入出来るよう改修しました。 従来は、最後尾に追加することしか出来なかったのですが・・・ これがまた使いづらく・・・今回、挿入出来るようにしてみました。

作ってみました！CSS3対応エディタ
とは、言うものの・・・決して素人には優しくない（筆者も含めて）ツールになってしまった感が・・・ ただ、HTML5やCSS3に知識なくして挑むの如何なモノかと？なので、最低限の知識は身につけて挑んで頂きたい。 （偉そうなこと言ってますが、これは自身にも言い聞かせていることです）基本的に、手動で編集出来てしまいますから、 扱いは慎重に願いたく、あくまでも編集をアシストするためのツールですので、 使う人の知識・力量で出来上がるものに差がでることは否めず、その辺りを念頭において扱って頂きたいと思います。

特徴を下記に

• 既存のファイルも開くことができます。
  CSSファイルをセレクタエリアへのドロップすることでも開くことができます。
  （ただし、セレクタが複数行に渡っているモノは正常に読み込めません）
• 開いたCSSはセレクタ毎に視覚化され、それぞれのプロパティを編集することができます。
• 編集途中でツールを閉じても再開時には続きから行えます。（オプションで変更可能）
• セレクタやプロパティを編集するためのアシスト機能、フォントとカラーを取得するサブツールも実装しました。
• ベンダープレフィックスを自動で付加する事ができます。（オプションで変更可能）

エディタのメイン画面

【その他のイメージ】

セレクタ構成ウィンドウ

プロパティ編集ウィンドウ

後ろ向きな感じで入った本記事ですが、未だCSS3へ対応したツールが少ない中、 他のツールなど全く意識せず自身に必要な機能だけで作ってみました。事足りるかは疑問ですが・・・ 実は少し前に出来上がってはいたのですが、諸事情あって今になってしまいました。一度お試しあれ的な感じでしょうか？