html - 模糊图像前面的元素

Question

大家好。我有这个问题。所以我有一个形象。在该图像的前面是具有宽度和高度的简单元素。我想模糊那个元素，所以它看起来像图片的那部分是模糊的。我不能在那个元素中有任何图像或背景图像。我想在不使用任何附加图像的情况下实现这种效果，仅使用 css。我尝试添加背景颜色，降低不透明度并添加过滤器:模糊，但效果不佳。我仍然可以阅读本应模糊处理的文本。

Answer 1

目前，如果没有 javascript，则不可能在完全支持的情况下做到这一点。但是如果你想支持一组有限的浏览器，你可以使用 backdrop-filter

The backdrop-filter CSS property lets you apply graphical effects such as blurring or color shifting to the area behind an element. Because it applies to everything behind the element, to see the effect you must make the element or its background at least partially transparent.