今回はCSSのbox-shadowを使って影(ドロップシャドウ)をつける方法と、コピペで使えるおしゃれな影のサンプルを10個紹介します。ぜひ参考にしてみてください。 CSSのbox-shadowの使い方 それでは、まずbox-shadowプロパティの使い方を紹介します。何かの要素に影をつけたいときには、例えば以下のように書きます。 ◯◯ { box-shadow: 左右の向きpx 上下の向きpx ぼかしpx 広がりpx 色 内側指定; } 例 .box {box-shadow: 2px 2px 4px -2px gray inset}
![【CSS】box-shadowで影をつける方法とサンプル集](https://cdn-ak-scissors.b.st-hatena.com/image/square/f692d1bd0e160060feb607f1672bcbe2a73359e3/height=288;version=1;width=512/https%3A%2F%2Fsaruwakakun.com%2Fwp-content%2Fuploads%2F2017%2F08%2Ffadddg.png)