要素に影を付けるプロパティです。X方向のオフセット、Y方向のオフセット、ぼかし半径、広がり、色を指定できます。複数の影を重ねることで立体的なデザインや多彩な効果を実現できます。
box-shadow: <offset-x> <offset-y> <blur-radius> <spread-radius> <color>.element {
box-shadow: 0px 4px 6px 0px #000000;
}box-shadow: none;影なし（デフォルト）
box-shadow: 0 2px 4px rgba(0,0,0,0.1);軽い影（ぼかし4px）
box-shadow: 0 4px 12px rgba(0,0,0,0.15);中程度の影（ぼかし12px）
box-shadow: 0 10px 30px rgba(0,0,0,0.3);強い影（ぼかし30px）
ホバー効果やフォーカス状態の表現によく使われる。
IE9+, 全モダンブラウザ