我想创建一个包含子 div 的父 div。父样式是
width: 100vw; height: 100vh; position: fixed; background-color: rgb(0 0 0 / 0.25); backdrop-filter: blur(2px); z-index: 8888; top: 0; left: 0;
子样式是
background-color: transparent; width: 200px; height: 200px; position: absolute; left: 400px; top: 400px;
有没有办法让子元素表现得像一个门户，其中它所在的区域删除了父 div 模糊和背景颜色？
tl;博士 看起来像这样的东西
--编辑--
如果问题是如何恢复子 div 中的背景过滤器，您可以使用
但是，如果您想从父级的父级继承此属性，则需要在 JavaScript 中执行此操作
在 CSS 中执行此操作的三种方法
1 使用相对 div 位置
div : { width: 100vw; height: 100vh; position: fixed; background-color: rgb(0 0 0 / 0.25); backdrop-filter: blur(2px); background-clip: text; z-index: 8888; top: 0; left: 0; } div div { background-color: transparent; width: 200px; height: 200px; position: absolute; left: 400px; top: 400px; }2个使用ID
#mainID : { width: 100vw; height: 100vh; position: fixed; background-color: rgb(0 0 0 / 0.25); backdrop-filter: blur(2px); background-clip: text; z-index: 8888; top: 0; left: 0; } #subDivID { background-color: transparent; width: 200px; height: 200px; position: absolute; left: 400px; top: 400px; }3 使用类
.mainID : { width: 100vw; height: 100vh; position: fixed; background-color: rgb(0 0 0 / 0.25); backdrop-filter: blur(2px); background-clip: text; z-index: 8888; top: 0; left: 0; } .subDivClass { background-color: transparent; width: 200px; height: 200px; position: absolute; left: 400px; top: 400px; }