CSS3 box-shadow Property

あるボックスシャドウを追加し<div>要素：

div {
box-shadow: 10px 10px 5px #888888;
}

もっと"Try it Yourself"以下の例。

定義と使用法

箱-shadowプロパティは、要素への1つ以上の影を添付します。

デフォルト値：	none
継承されました：	no
アニメーション：	yes. Read about animatable Try it
バージョン：	CSS3
JavaScriptシンタックス：	object .style.boxShadow="10px 20px 30px blue" Try it

表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。

数字は-webkit-に続くかの接頭辞で働いていた最初のバージョンを指定します-moz-。

プロパティ
box-shadow	10.0 4.0 -webkit-	9.0	4.0 3.5 -moz-	5.1 3.1 -webkit-	10.5

box-shadow: none|h-shadow v-shadow blur spread color |inset|initial|inherit;

Note:箱-shadowプロパティは、要素への1つ以上の影を添付します。 プロパティは、影、2-4の長さの値、任意の色、オプションのインセットのキーワードで指定された各のカンマ区切りリストです。省略長さは0です。

値	説明	それを再生します
none	デフォルト値。影は表示されません	それを再生します»
h-shadow	必須。水平方向の影の位置。負の値は許可されています	それを再生します»
v-shadow	必須。垂直影の位置。負の値は許可されています	それを再生します»
blur	任意。ブラー距離	それを再生します»
spread	任意。影の大きさ。負の値は許可されています	それを再生します»
color	任意。影の色。デフォルト値は黒です。見CSSカラー値の可能な色の値の完全なリストについて。注：サファリでは(on PC)色のパラメータが必要です。あなたは色を指定しない場合、影がまったく表示されません。	それを再生します»
inset	任意。外側の影から影を変更します(outset)内側の影に	それを再生します»
initial	このプロパティがデフォルト値に設定します。初期についての記事を読みます	それを再生します»
inherit	その親要素からこのプロパティを継承します。継承についての記事を読みます

テーブルの上に投げられた画像
この例では、作成する方法を示し"polaroid"の画像をし、画像を回転させます。