我想要一个Vista/7-航空玻璃风格效果在我网站上的弹出窗口上，它需要是动态的。只要网站仍然存在，我就可以接受这不是跨浏览器效果works在所有现代浏览器上。
我的第一次尝试是使用类似的东西
#dialog_base {
background:white;
background:rgba(255,255,255,0.8);
filter:blur(4px);
-o-filter:blur(4px);
-ms-filter:blur(4px);
-moz-filter:blur(4px);
-webkit-filter:blur(4px);
}
然而，正如我所料，这导致了content对话框变得模糊并且背景保持清晰。有没有办法使用CSS来模糊半透明元素的背景而不是其内容？
华侨城。 2016年更新
自从-moz-element()除了 FF 之外，其他浏览器似乎并没有广泛支持 .property 属性，有一种更简单的技术可以在不影响容器内容的情况下应用模糊。在这种情况下，将伪元素与 svg 模糊滤镜结合使用是理想的选择。
使用伪元素检查演示
（演示在 FF v49、Chrome v53、Opera 40 中进行了测试 - IE 似乎不支持使用 css 或 svg 滤镜进行模糊处理）
（到目前为止）在没有 js 插件的情况下在后台产生模糊效果的唯一方法是使用-moz-element()属性结合svg模糊滤镜。和-moz-element()您可以将一个元素定义为另一个元素的背景图像。然后你应用svg模糊滤镜。可选：如果您的背景位于fixed位置。
在这里查看我的演示
我知道这是一个相当复杂的解决方案并且仅限于 FF (element()目前仅适用于 Mozilla-moz-element()财产）但至少有一些努力过去在 webkit 浏览器中实现，希望能够实现将来.
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
