top

StyleCatcherテーマ「青」

070120.jpg

お正月にStyleCatcherで遊んでいた時、公開するだけでなく、これまでに作った自分のデザインを管理・整理するためのツールとしても使えるんじゃないかと思いつきました。それで以前に使っていたデザインやスタイルをStyleCatcherに対応した形で再現して記録してみたら面白いんじゃないかと思いつき、ちょっと試してみました。ついでなので公開もしてみます。

2カラムだった時代(3.17)に使っていたデザインです。カラムが上から完全に分離しているのが特徴です。実際に使用していた時はテンプレートをいじってカラムを2つに分離させていたのですが、今回はデフォルトテンプレートには一切手を触れず、CSSのみで実現することに挑戦してみました。
ヒントは他のテーマを眺めていた時、marginにマイナス(-)も指定できることに気が付いたことから。そうかっ、マイナスにすればサイドバーが上へ上がってくれるんだ~。なんとっCSSのみでこういう形にすることも出来たんですね。その代わりバナーの高さは固定しとかないとカラムトップ位置がずれますが(^-^;。

テーマサンプルページ
(スタイル切り替えでご確認下さい)

■仕様とか利用規約とか■
・3.3デフォルトテンプレートに合わせて作っています。それ以前のバージョンだと表示が崩れる恐れがあります。
・1カラム/2カラム右サイドバー/2カラム左サイドバー/3カラムに対応しています。
・IE6/Firefox/Netscape7で動作確認しています。マック環境は分かりません。
・カスタマイズはご自由にどうぞ。
・再配布は禁止です(カスタマイズされたものも含む)。

■リポジトリアドレス
http://wing.w-museum.com/wmstyle

StyleCatcherの使い方はこちら
カラムの変更のしかたはこちら

*おかしなところとかればお知らせ下さい(^^;。

<2007.2.13>
サンプル頁をスタイル切り替えに変更。