在不重构html的情况下模糊背景？

我试图将CSS模糊属性应用于包装器div，但不想影响我的文本。在我使用的框架中，重新构造html是相当困难的。有没有办法只蓝背景而不蓝文本

HTML结构

<div class="wrapper">
<h1>Hello World</h1>
</div>

---

如果有人能为我指出解决方案的方向，如果有，我将不胜感激

也许值得注意的是，你实际上不能模糊背景…只能模糊元素

因此，这里的答案是伪元素

.wrapper{
位置：相对位置；
}
.wrapper：：之前{
内容：''；
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
身高：100%；
-webkit过滤器：模糊（5px）；
-moz过滤器：模糊（5px）；
-o-滤波器：模糊（5px）；
-ms过滤器：模糊（5px）；
过滤器：模糊（5px）；
背景色：红色；
z指数：-1；
}

你好，世界

尝试使用

.wrapper:before

并设置其背景样式，而不是

.wrapper

。

---

这可能会有所帮助。

虽然这可以从理论上回答问题，但请在此处包含答案的基本部分，并提供链接供参考。如果链接页面发生变化，只有链接的答案可能会变得无效…我刚才也回答了这个问题…但是你不能模糊背景…只有元素。是的，你是对的。我现在有点急。我以后再编辑。你可以这样做，但你只是重复我已经回答过的问题……这取决于你。

.wrapper{
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
background-color:red;
}