類似iOS的半透明模態，模糊背後的背景

Question

我想重溫2012年的this similar question。我想知道是否有任何東西從發佈特定問題的時間開始改變？

是否可以創建一個不需要canvas頁面渲染的模式，然後將其顯示並剪切爲所需的大小？

如果是這樣，有沒有辦法顯示這個跨瀏覽器？

Answer 1

我看到@Michael Wasser在前面的問題中提到了「-webkit-filter」。這就是你如何在不依賴Javascript的情況下做到這一點。

img { 
    -webkit-filter: blur(10px); 
} 

有關更多信息，請參閱this HTML5Rocks article。

它受到了多大的支持？

caniuse.com說全球支持在43.67% at the moment。所有最近的Chrome，WebKit（Safari）和Opera（現在它已切換到Blink）都應該有它們。不確定Mozilla和微軟的計劃是什麼。

在Firefox中，您可以使用SVG filters重新創建模糊。