作爲純粹美學設計的事物，我想知道是否有可能讓具有非透明背景的元素模糊背後的內容。使背後的內容變得模糊的遮罩
更具體地說，當我有一個模式框出現時（作爲我的自定義警報/確認/提示設置的一部分），當前背景內容通過在屏幕上使用與文檔背景相同的顏色來「淡化」 。
我想要做的是將少量的模糊（僅幾個像素）應用於蒙版內容，以進一步引導對模態框的注意。
瀏覽器兼容性不是問題，因爲正如我所提到的，它純粹是美學的。我最好喜歡它在IE9中工作，如果可能的話。
另外，沒有jQuery。無論如何，如果你願意，可以在jQuery中提供一個答案，但是在將它放到我的站點附近之前，我會將它翻譯成原始的JS。
純CSS不可能的..
toDataUrl來獲取圖像，並使用它作爲背景，以您的彈出...這是一個相當複雜的過程，需要很多JavaScript，但我相信它是唯一的方法...
凱，感謝您的信息，但正如你所說，這是很多工作，所以我認爲我只會廢除這個想法！ – 2012-03-18 16:13:09
對於那些想了解現代解決方案的人，請留意['backdrop-filter']（https://webkit.org/blog/3632/introducing-backdrop-filters/）。 – Wildhoney 2016-03-31 11:20:17
@Wildhoney真棒，謝謝你的頭！ – 2016-03-31 11:40:02
這將需要JavaScript（和相當複雜的JavaScript）。
從我所瞭解的情況來看，這聽起來像是您想要創建一個'Aero glass'效果，其中半透明元素背後的內容會產生模糊效果。單獨使用HTML和CSS是不可能的（除非您考慮使用IE-only filters）。
目前，沒有任何CSS屬性可以像您所描述的那樣動態應用圖像過濾器。
感謝您的指點 - 我知道IE過濾器，我擔心這會是這種情況... – 2012-03-18 15:52:19
Gaby提出的html2canvas解決方案可能是矯枉過正。您可以通過已經模糊的相同網站的iframe獲得相同的效果（通過濾鏡模糊或其他技術 - 「-webkit-filter：blur（2px）」只在我知道的情況下在Chrome中可用）
這說，我會說這兩個解決方案真的很hacky，我個人從來沒有使用過我自己，我試過這個只是爲了看看它是否可能出於好奇。
看到一個（僅鉻）這裏的例子：https://s3.amazonaws.com/blur-demo/index.html
你說沒有jQuery，但你怎麼做你的模態，普通的JavaScript？ – j08691 2012-03-18 15:50:57
我的網站上的所有東西都是普通的JS，它比jQuery完成的功能相當有效得多） – 2012-03-18 15:51:56
難道你不能使用透明的PNG或GIF來模擬模糊？像這樣http://jsfiddle.net/j08691/hveTX/ – j08691 2012-03-18 18:29:18