一、filter

这种方式有白边，需要把盒子设置大一点，把白边隐藏。

<div class="bg-box">
    <div class="bg"></div>
<div>
<style>
.bg-box{
    width:100%;
    heigth:100%;
    position:relative;
    overflow:hidden;
}
.bg{
    position:absolute;
    top: -2.5%;
    left: -2.5%;
    z-index: -2;
    height: 105%;
    width: 105%;
    filter: blur(5px);
}
</style>

二、backdrop-filter

适用于元素背后的所有元素，为了看到效果，必须使元素或其背景至少部分透明。

在需要模糊的盒子上添加一层遮罩的盒子

<div class="box">
    需要模糊的内容
<div>
<div class="filter"></div>
<style>
.filter{
    position:absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    backdrop-filter: blur(2px);
}
</style>

详细可看

filter - CSS（层叠样式表） | MDN

backdrop-filter - CSS（层叠样式表） | MDN