Html CSS-Div内Div模糊

我在另一个分区里有一个分区。 我想给第一个div一个BG和一个filter:blur（5px） 但是，第二个div不应受到影响 我已经试过了

.div1 {
    background-image: url("https://myimage.com/image.png");
    filter: blur(5px)
}
.div2 {
    filter: none !important
}

---

你不能那样做…是什么让父母让孩子变得模糊…我想你只是想让图像变得模糊…对吗

您必须使用另一个元素（或伪元素）来保存图像（或背景图像）并使其模糊

*{
框大小：边框框；
}
.家长{
位置：相对位置；
宽度：284px；
高度：196px；
保证金：1em自动；
边框：1px纯红；
填充：24px；
溢出：隐藏；
/*剪辑任何溢出模糊*/
}
.parent：：之前{
内容：''；
位置：绝对位置；
身高：100%；
宽度：100%；
排名：0；
左：0；
背景图片：url(http://www.fillmurray.com/284/196);
-webkit过滤器：模糊（5px）；
过滤器：模糊（5px）；
z指数：-1；
-webkit转换：规模（1.05）；
转换：标度（1.05）；
/*轻微过度缩放，使模糊达到所有边缘*/
}
.孩子{
宽度：200px；
高度：148px；
保证金：自动；
背景：rgba（0,0,0,0.5）；
颜色：白色；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}

Lorem ipsum dolor sit。

你不能这样做…什么使父母模糊使孩子模糊…我想你只是想模糊图像…对吗

您必须使用另一个元素（或伪元素）来保存图像（或背景图像）并使其模糊

*{
框大小：边框框；
}
.家长{
位置：相对位置；
宽度：284px；
高度：196px；
保证金：1em自动；
边框：1px纯红；
填充：24px；
溢出：隐藏；
/*剪辑任何溢出模糊*/
}
.parent：：之前{
内容：''；
位置：绝对位置；
身高：100%；
宽度：100%；
排名：0；
左：0；
背景图片：url(http://www.fillmurray.com/284/196);
-webkit过滤器：模糊（5px）；
过滤器：模糊（5px）；
z指数：-1；
-webkit转换：规模（1.05）；
转换：标度（1.05）；
/*轻微过度缩放，使模糊达到所有边缘*/
}
.孩子{
宽度：200px；
高度：148px；
保证金：自动；
背景：rgba（0,0,0,0.5）；
颜色：白色；
显示器：flex；
对齐项目：居中；
证明内容：中心；
}

Lorem ipsum dolor sit。

你的回答确实比我快；）是的，

：：在

之前，负的

z-指数

可能是最干净的解决方案+1你在这个答案上击败了我；）是的，

：：在

之前，使用负的

z索引

可能是最干净的解决方案+1