[CSS]ページに美しいシャドウを加え、奥行きを与えるスタイルシート -Depth

ブラウザ上枠のすぐ下、ページの上部に、いい感じのシャドウを加えるスタイルシートを紹介します。

Chrome, Safari, Firefox, Operaでご覧ください、IEは9+で。

Depth

実装は簡単で、HTMLは特に変更することなく、下記のスタイルシートを加えるだけです。
position: fixed;なので、スクロールしてもシャドウが表示されています。

body:before { /* top shadow */
	content: "";
	position: fixed;
	top: -10px;
	left: -10px;
	width: 110%;
	height: 10px;

	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	-ms-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	-o-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	box-shadow: 0px 0px 10px rgba(0,0,0,.8);
	z-index: 100;
}