私のサイドバーに影があります

Question

私は私のページに右のサイドバーがあります。このサイドバーの左側に影があります。 Googleマップの左側のサイドバー（http://maps.google.be）に表示されているような非常に明るい影があります。出来ますか？ここで

のアイデアを持っているjsFiddleです：http://jsfiddle.net/yhfXX/3/

は通常のサイドバーには、完全な高さを取る必要がありますが、これjsFiddleは単なる一例です。

おかげ

Answer 1

あなたは、ドロップシャドウを作成するためにbox-shadow CSSルールを使用します。

#sidebar { 
    -moz-box-shadow: -3px 0 5px 0 #555; 
    -webkit-box-shadow: -3px 0 5px 0 #555; 
    box-shadow:   -3px 0 5px 0 #555; 
} 

DEMO

使用である：水平影のオフセット

1. 、ポジシャドウボックスの右側にあることを意味し、負の意志をオフセット箱の左側に影を置く。
2. 影の垂直オフセットは、陰影の1つはボックス影がボックスの上にあることを意味し、肯定的なものは影がボックスの下にあることを意味します。
3. ぼかし半径（オプション） 0に設定すると、シャープがシャープになります。数値が大きくなるほど、ぼやけます。
4. 拡散半径（オプション）、正の値はシャドウのサイズを大きくし、負の値はサイズを小さくします。デフォルトは0です（影はぼかしと同じです）。
5. CSS3のはめ込み影だ色

Box-shadow support table

Answer 2

：

.shadow { 
    -moz-box-shadow: inset 0 0 10px #000000; 
    -webkit-box-shadow: inset 0 0 10px #000000; 
    box-shadow:   inset 0 0 10px #000000; 
} 

は、あなたがそうのように、そのためにCSSを使用することができますあなたの必要性

Answer 3

に10pxのを調整します。

text-shadow: 0px 3px 2px rgba(0, 0, 0, 0.5); 

あなたのための最良のセットアップを見つけるために、それを用いた実験=）

Answer 4

これは、W3Cからサポートされていません。

.shadow { 
    **-moz-box-shadow: inset 0 0 10px #000000;** 
    **-webkit-box-shadow: inset 0 0 10px #000000;** 
    box-shadow:   inset 0 0 10px #000000; 
}