css3で実装するドロップシャドウの応用・めくれた感じを作り出す

css3で新たに加えられたドロップ シャドウを使って一歩進んだシャド ウを作るTipsです。画像でよく使わ れている、めくれた際に出来る様な シャドウをcssのみで実装。 以下のようなシャドウをcssのみで実装します。 cssとHTMLのソースは以下。 htmlは以下 <div id="shadows"> <article> <h3>CSS3 でめくれた感じのドロップシャドウを</h3> <p>下部の両端にドロップシャドウがあると思います。良く見る手法ですね。これを画像を使わず、css3のみで実装します。</p> </article> </div>css div#shadows { width: 559px; margin: 20px auto; position: relative; } article { background: #dcdcdc; -webkit-border-radi

[vanillate]

うごきかわゆ　#vani_kawaii

[sevenstars000]

めくる

[sw_lucchini]

box-shadowを擬似セレクタ「after・before」を使いめくれた感を出すテクニック

[raimon49]

rotate

[tpex_ovon]

おおおお