この辺に落ち着こうかな。

従来のノーマルタイプ。キャプションは画像の下に表示されます。

ポラロイド風。キャプションが画像のボーダー内に含まれるパターン

ドロップシャドウあり、ボーダーなしのパターン

ドロップシャドウなし、ボーダーありのパターン

ドロップシャドウもボーダーもなしのパターン。

　今回の試行で分かったことは、IE7のみに適用されると思っていたCSSハックが、実はOpera9.xにも有効だったこと。

*+html body div.shadow { margin-bottom: -15px; } /* just for IE7 */

　何かOpera9.27での表示がおかしいなと思ったら、このハックがOperaにも適用されていました（追記：XML宣言するとOperaにも通ってしまうみたいです）。なので、純粋にIE7のみをターゲットとしたい場合は、以下のようにすると良いらしい。

*:first-child + html div.shadow { margin-bottom: -15px; } /* just for IE7 */

　ちょっとググった感じでは、IE6とIE7とを一緒にハック対象とする方法が分からなかったんだけど、個別に書かないとダメかなぁ。

　近々、ドロップシャドウのまとめ記事を書こうかと思っています。

CSS