子 div を含む親 div を作成したいと考えています。親スタイルは
です幅: 100vw; 高さ: 100vh; 位置: 固定; 背景色: rgb(0 0 0 / 0.25); 背景フィルター: ぼかし(2px); z インデックス: 8888; トップ: 0; 左: 0;
サブスタイルは
です背景色: 透明; 幅: 200ピクセル; 高さ: 200ピクセル; 位置: 絶対; 左: 400ピクセル; 上: 400px;
子要素をポータルのように動作させ、その領域に親 div のぼかしと背景色を削除する方法はありますか?
tl;博士号 次のようなものです
### - 編集 - ###
子 div の背景フィルターを復元する方法が質問の場合は、
を使用できます。背景フィルター: なし;
element.style.backdropFilter = element.parentNode.parentNode.style.backdropFilter;
CSS でこれを行う 3 つの方法1 相対 div 位置を使用します
div : { 幅: 100vw; 高さ: 100vh; 位置: 固定; 背景色: rgb(0 0 0 / 0.25); 背景フィルター: ぼかし(2px); 背景クリップ: テキスト; z インデックス: 8888; トップ: 0; 左: 0; } div div { 背景色: 透明; 幅: 200ピクセル; 高さ: 200ピクセル; 位置: 絶対; 左: 400ピクセル; 上: 400ピクセル; }
#メインID : { 幅: 100vw; 高さ: 100vh; 位置: 固定; 背景色: rgb(0 0 0 / 0.25); 背景フィルター: ぼかし(2px); 背景クリップ: テキスト; z インデックス: 8888; トップ: 0; 左: 0; } #サブディビジョンID { 背景色: 透明; 幅: 200ピクセル; 高さ: 200ピクセル; 位置: 絶対; 左: 400ピクセル; 上: 400ピクセル; }
.メインID : { 幅: 100vw; 高さ: 100vh; 位置: 固定; 背景色: rgb(0 0 0 / 0.25); 背景フィルター: ぼかし(2px); 背景クリップ: テキスト; z インデックス: 8888; トップ: 0; 左: 0; } .subDivClass { 背景色: 透明; 幅: 200ピクセル; 高さ: 200ピクセル; 位置: 絶対; 左: 400ピクセル; 上: 400ピクセル; }