如何製作CSS環繞投影？還是有一個好方法？用最少的膠帶？

我想要一個矩形的DIV在四周都有一個陰影。如何製作CSS環繞投影？還是有一個好方法？用最少的膠帶？

現在我可能能夠通過使用容器div來獲得類似於我想要的內容，並且具有一個帶正的陰影和一個帶負值的陰影;我還沒有看到我能推動什麼。因爲這是在樣板代碼中完成的，所以我可以有一系列嵌套的DIV，它們具有不同的邊框顏色，即舊的CSS前置方式。有些方法我可以爲四個DIV製作四個投影。例如，參見「CSS shadows on 3 sides」。

但是，我所看到的所有解決方案或在搜索中看到的證據都像管道膠帶一樣聞起來。是否足夠強烈地設計了雙面陰影，以便在沒有膠帶的情況下無法優雅地實施4面？

如果必須的話，我會使用膠帶，但是我想知道是否有一種很好的方法可以在各種品牌的膠帶之間進行選擇。

來源

2013-03-14 JonathanHayward

你正在尋找更多的開銷，懸停陰影？

.shadow { 
    -webkit-box-shadow:0 0 10px rgb(0,0,0); 
    -moz-box-shadow:0 0 10px rgb(0,0,0); 
    box-shadow:0 0 10px rgb(0,0,0); 
}

你也可以使用它與插入太多，使一個非常好的3d看起來的邊緣。

來源

2013-03-14 20:17:09 PlantTheIdea

賓果; upvoted，並打算在9分鐘後允許接受。謝謝， – JonathanHayward 2013-03-14 20:21:00

沒問題。我喜歡使用這些傢伙的微妙版本：懸停。 – PlantTheIdea 2013-03-14 20:22:34

沒想過;我會很高興讓這個建議煨。 – JonathanHayward 2013-03-14 20:31:00

您可以將可選的傳播值（10px）添加到您的語法。像這樣：

.dropshadow { 
-webkit-box-shadow: 0px 0px 5px 10px rgba(0,0,0,.5); 
-moz-box-shadow: 0px 0px 5px 10px rgba(0,0,0,.5); 
box-shadow: 0px 0px 5px 10px rgba(0,0,0,.5); 
}

來源

2013-03-14 20:21:35

如何製作CSS環繞投影？還是有一個好方法？用最少的膠帶？

回答

相關問題