CSS3使用子元素保留內部盒子陰影？

Question

看一看這樣的： http://jsfiddle.net/6Yq8b/78/

有沒有一種方法可以讓我保持一個div內部的箱陰影當子元素的邊界向外移動的？在給定的鏈接中，會發生什麼情況是子元素（「toplid」）遮蔽了盒子頂部的內部盒子陰影...

想法？

Answer 1

您可以通過它應用中插入進去的影子模擬#toplid元素包裝盒上的影子：

#toplid { 
    box-shadow: inset 0 80px 42px -2px black; 
} 

http://jsfiddle.net/6Yq8b/86/

---

編輯：

您已經有了箱在該元素上設置陰影，所以使用多個陰影：

#toplid { 
    box-shadow:0 0 20px -2px black, inset 0 80px 42px -2px black; 
} 

http://jsfiddle.net/6Yq8b/87/