sakuraエディタのアウトライン解析を発見！CSS修正がいい感じ♪

新しくCSSを書き始める時はDreamweverの入力補完に勝るものはないけど、ちょっと修正するときに立ち上げるには、adobe系の起動時間は長い。長すぎる。

しかも、「そのあたり」を探すのに、まずHTMLソースでタグのIDやクラス名を確認して、CSSを開いて検索する行為が面倒。
も少しラクな方法はなかろうか。

と考えていたら、sakuraエディタで「アウトライン解析」なる機能を発見。

（半角英数字に変換しようとF10を押したつもりが、F11を押したらしく、偶然出てきました。ただのテキストエディタじゃないのね。人生ってすばらしい。）

原稿を書くときにアウトラインプロセッサの機能って便利だけど、これをCSSに応用してみようではないか！

まず、自分はCSSを書くときに各ブロックごとに見出しを以下のようにつけているので、その前提です。

/*-------------------------------------------------
++LAYOUT
-------------------------------------------------*/

テキストファイルに以下を記入して

++ /// LV0
# /// LV1
. /// LV1

ファイル名を css.pl とかなんとかで保存
（sakuraエディタが保存されているあたりへ　「C:Users○○○AppDataRoamingsakura」）

sakuraエディタを開き、メニューの「設定」→「タイプ別設定一覧」を開く。
未設定の定義を選び（通常なら「設定17」とか）、「設定変更」を選ぶと、タイプ別設定画面が開くので、

と入力し、右側の真ん中にある「アウトライン解析方法」の「ルールファイル」にチェックして、先ほど保存した「css.pl」を読み込む。

そうすると、cssの拡張子のあるファイルはこの定義が適用されます。
CSSファイルを開いて、F11（またはステータスバーにある「アウトライン解析」）を押すと↓こんな感じでメニューみたいにツリー状で現れます。

「++」を親としてid「#」やclass「.」を折りたたんでます。

MTで、サイドバーだけ編集したい時は、「++WIDGET」を開いてダブルクリックすると、その行に飛ぶので、ほんのちょっと作業がラクに。
時間があったらこれに入力補完のルールを適用してもよいけど、基本はDWで記述していくので、今のところは必要ないかも。

タグ指定を追加したものを作ってみた。
よかったらどうぞ。→

css.txt