今月のいらんことしい（2013年 1月）

今月（2013年 1月）、サイトでカスタマイズした点をまとめたエントリです。

• Vicuna テンプレートの枠にbox shadow を適用

このブログ（Vicuna テンプレート使用）にbox shadow をつけてみました。

• box-shadow－CSS3リファレンス

Vicuna の場合、ヘッダーとフッター、コンテンツと分けられて構成されています。

影のために外枠でラッピングするのもなんですので、今ある要素のままでスタイルを適用したいとおもいます。

そのためには、それぞれ3つの要素ごとにbox shadow をかける必要がでてきます。

これをやると、影の広がりの距離の関係で、水平方向の影が要素の上下で重なって不自然な影のつきかたになってしまいます。

そこで、影の位置をそれぞれずらすことによって（なるべく）不自然につながらないようにみせています。

div#header には

• box-shadow: 0px -6px 10px 4px rgba(0, 0, 0, 0.6);

div#content には

• box-shadow: 0px 0px 10px 4px rgba(0, 0, 0, 0.6);

div#footer には

• box-shadow: 0px 6px 10px 4px rgba(0, 0, 0, 0.6);

今月のカスタマイズは以上です。以下に過去のカスタマイズ記録リストがあります

• 当ブログのカスタマイズ記録