【CSS】box-shadowで影をつける方法とサンプル集

今回はCSSのbox-shadowを使って影（ドロップシャドウ）をつける方法と、コピペで使えるおしゃれな影のサンプルを10個紹介します。ぜひ参考にしてみてください。 CSSのbox-shadowの使い方 それでは、まずbox-shadowプロパティの使い方を紹介します。何かの要素に影をつけたいときには、例えば以下のように書きます。 ◯◯ { box-shadow: 左右の向きpx 上下の向きpx ぼかしpx 広がりpx 色 内側指定; } 例 .box {box-shadow: 2px 2px 4px -2px gray inset}

[sutetuki]

img class="shadow" .shadow{box-shadow: 5px 10px 20px rgba(0,0,0,0.25);}

[microgravity]

“box-shadow: 0 0 8px”