CSSで影をつける

上と左にもラインがある方がいいような気がするのだけどどうだろう。このブロックは３ピクセルの影バージョン。

こちらは２ピクセル影バージョン。
おっと同じクラス名を使ったら前の記事とかぶってしまった。

3ピクセル版のソース

<style>
<!--
.shadow_box0_2 {
  padding: 4px;
  border-top:none;
  border-left:none;
  border-bottom:1px solid #000;
  border-right:1px solid #000;
}
.shadow_box1_2 {
  padding: 0px;
  border-top:none;
  border-left:none;
  border-bottom:1px solid #666;
  border-right:1px solid #666;
}
.shadow_box2_2 {
  padding: 0px;
  border-top:1px solid #888;
  border-left:1px solid #888;
  border-bottom:1px solid #aaa;
  border-right:1px solid #aaa;
}
-->
</style>

<div class="shadow_box2_2" style="width:400px;">
<div class="shadow_box1_2">
<div class="shadow_box0_2">
イメージを持ち込まずにボックスに影をつけることが出来るか？...
</div>
</div>
</div>