如何創建一個淺橢圓形的CSS3陰影

我知道如何使用CSS3陰影。不過，我正在嘗試實現特定的設計。我希望陰影在左右邊緣上變得更輕且淡化，請參閱附圖。如何創建一個淺橢圓形的CSS3陰影

Shadow Design

唯一的代碼，我想出瞭如下。但不知道如何讓邊緣淡出更多。

.shadow {box-shadow: 0 10px 6px -6px #000000;}

任何提示是有幫助的

2012-03-28 Steven Wu

您是否嘗試過使用css漸變？我認爲這是通過CSS實現這一目標的唯一方法。 – 2012-03-28 11:07:21

我使用了box-shadow，border-radius和clip的組合。

2012-03-28 11:20:14 martinjlowm

這是完美的！沒想到使用Pseudo-class：before或border-radius來實現這一點。謝謝。 – 2012-03-28 11:24:56

你可以玩弄箱陰影和漸變這裏

，但我不認爲你可以申請在陰影衰落

2012-03-28 11:12:41 p0rter

是的，我試過CSS3創，但沒有幫助 – 2012-03-28 11:23:03

像這樣的事情？ enter image description here

box-shadow：0px 20px 37px -28px＃000000;

2012-03-28 11:20:18 quatermain

有點但不完全。但@martinjlowm解決方案是完美的 – 2012-03-28 11:25:26

嗨，你可以通過邊界半徑&箱陰影創建橢圓形CSS3陰影....

或可以看到現場演示： - http://jsbin.com/elacen/5/edit

2012-03-28 12:17:11

回答