CSS3は背景画像にマスクを設定し、マスクスタイルの継承の問題を解決します。

   <スタイル>
        。親{
            背景: url('./test.jpg') 繰り返しなし 中央;
            フィルター: ぼかし(3px)
        }
        。息子{
            フィルター: ぼかし(0);
            /*
            子タグに同じ属性を設定しても、継承されたスタイルを上書きすることはできません*/
        }
    </スタイル>

    <div class="parent">
        <p class="son">こんにちは</p>
    </div>

   <スタイル>
        。親{
            位置: 相対的;
            /*親タグを相対的に配置して、.middle を相対的に配置します*/
        }
        。真ん中{
            背景: url('./test.jpg') 繰り返しなし 中央;
            フィルター: ぼかし(3px);

            位置: 絶対;
            高さ: 100%;
            幅: 100%;
            
            Zインデックス: -1;
            /*他のサブ要素を覆わないようにレイヤーの高さを減らします*/
        }
        。息子{
        }
    </スタイル>
    
    <div class="parent">
        <div class="middle"></div>
        <p class="son">こんにちは</p>
    </div>