Deprecated: Function ereg() is deprecated in /virtual/bsakatu/module/xml_declaration.inc on line 4
メモ帳日記 : CSS管理方法変更
  1. メモ帳日記 >
  2. Web >
  3. HTML / CSS >
  4. CSS管理方法変更

メモ帳日記

日記書いたりメモ書いたり

2007年 1月 22日(先負

CSS管理方法変更

前々からやろうと思っていた CSS の管理方法に,センター休みを利用して移行した。この管理方法は,この前移転が完了したまうんとらんオンラインでもやっている。詳しくは以下。ただし,以下に示したのは最小限の構成。個別の CSS が必要になったら,css/HTML ファイルと同じ構成,ファイル名で置く。

/css/
 │
 ├ common/
 │ ├ default.css
 │ ├ default.css.gz
 │ ├ minimum.css
 │ └ module.css
 │
 ├ mt/
 │ ├ mt.css
 │ └ mt.css.gz
 │
 └ theme/
    └ theme-first.css
default.css
本来,reset.cssdisplay.cssfonts.cssdefault.css というふうに分けるつもりでいたのを統合したもの。
reset.css
ファイル名のとおり,ブラウザのデフォルトスタイルをリセットする。これをやらないと後で果てしなく苦労する。
display.css
仕様書通りの display の値を宣言する。
fonts.css
Yahoo! UI Library (YUI) の CSS Fonts にある CSS を参考にしたもの。ブラウザのフォントサイズを統一する。他に,標準の font-family も宣言している。
default.css
ブラウザのデフォルトスタイルに当たるものを再定義したもの。
minimum.css
最小限のスタイルをインポートするもの。個別のスタイルの先頭でこれをさらにインポートしている。
module.css
共通の部品をモジュールみたいにしてまとめてあるもの。
mt.css
名前のとおりこの blog (Movable Type)のスタイルを宣言している。このファイル名には納得していない。
theme-first.css
default.css では定義していない,色関連を定義している。これを変えることで色を変える。これも名前には納得していない。いずれはテーマ毎の名前を付ける。

いやー,超便利。ブラウザ毎の微妙な差があんまりでないから手間が減った。アメリカの Yahoo! はいいね。日本のはくそだけど。

今回の管理方法変更は,スタイルシートを分けて管理する方法をまとめる - 2xup.org を見て,やろうと思い試してみた。ここをこのサイトぐらいのレベルまでデザインしたいな(たぶん無理)。