CSS で背景ぼかし効果を実装するサンプルコード

 <div class="ログインコンテナ">
     //このdivは背景画像です <div class="beijing"></div>
     //この div は表示されるコンテンツ ブロックで、ロゴとログイン ボックスです <div class="content"></div>
  </div>

 .ログインコンテナ{
    位置: 相対的;
    幅: 100%;
    高さ:100%;
    位置: 相対的;
    //フレックスレイアウトを使用してコンテンツを垂直方向に中央揃えします。モジュール表示: flex;
    flex-direction: 列;
    位置: 相対的; 
  }
 .beijing{ //背景画像スタイル width: 100%;
    高さ: 100%;
    位置: 絶対;
    左: 0px;
    上:0px;
    背景: url('../../../static/img/timg (1).jpg');
    背景繰り返し: 繰り返しなし;
    背景サイズ: カバー;
    -webkit-filter: ぼかし(10px);
    -moz-filter:ぼかし(10px);
    -o-フィルター: ぼかし(10px);
    -ms-filter:ぼかし(10px);
    フィルター: ぼかし(10px);
  }
.content{ //コンテンツ画像スタイルの幅: 80%;
	高さ: 70%;
	位置: 絶対;
	zインデックス: 5;
}