書式
box-shadow: X方向のオフセット Y方向のオフセット ぼかし具合 色, 左と同じパラメータ,...;
box-shadow: 色 X方向のオフセット Y方向のオフセット ぼかし具合, 左と同じパラメータ,...;
box-shadow: X方向のオフセット Y方向のオフセット ぼかし具合 拡幅サイズ 色, 左と同じパラメータ,...;
box-shadow: 色 X方向のオフセット Y方向のオフセット ぼかし具合 拡幅サイズ, 左と同じパラメータ,...;
説明
ボックスに複数の影を付けるにはbox-shadowに影のオフセット（ずれ具合／移動量）、ぼかし具合、色を1セットとしてカンマで区切って指定します。表示したい影の数だけ指定します。
なお、古いブラウザで反映されない場合にはベンダープレフィックスを付けてみてください。IE9とOperaではベンダープレフィックスバージョンはサポートしていません。
h1 {
border: 1px solid black;
width: 500px;
box-shadow : 10px 8px 5px red;
}
目次に戻る