【CSS3】CSSだけで写真に印象的なエフェクトを加える

box-shadowを内向きにかけて写真をオシャンティにします。

HTML

<p class="pic"></p>

CSS

.pic { width:240px; height:320px; background:url(img.jpg); box-shadow:0 0 100px #000 inset; }

box-shadowにinsetという値を追加すると影が内向きに付きます。

デモ

デモページ