有沒有辦法使用CSS創建軟件盒的背景陰影？

Question

想象一下，一個軟件盒類似如下：

http://www.sitellite.org/pix/sitellite-box.gif

現在想象的陰影是不存在的。有沒有可以模擬背景陰影的CSS方式，並且至少可以在Firefox和Chrome上工作，如果不是，也可以使用IE9或更高版本？

Answer 1

的一種方法是啓動用三角形形狀像這樣

<div id="triangle"></div> 

#triangle { 
    width: 0; 
    height: 0; 
    border-top: 100px solid grey; 
    border-left: 100px solid transparent; 
    opacity:0.1; 
}​ 

see example

然後添加一個線性梯度，並將其圖像後面的位置。看看這個gradient generator作爲一個起點。

然後，您可以使用transform稍微傾斜它。