<div class="row">
<div class="col-lg-3">
    <button class="btn">
         button
    </button>
</div>

.col-lg-3{
    background-color:#8CD6EB;
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}

解决方法

有一个替代解决方案：在父div内创建两个元素 – 一个div用于背景,另一个div用于内容.设置位置：相对于父div和设置位置：absolute;顶：0像素;右：0像素;底部：0像素;左：0像素; (或将高/宽设置为100％)设置为背景的子元素.使用此方法,内容div不会受到背景上的属性的影响.

例：

<div id="parent_div" style="position:relative;height:300px;width:300px;">
    <div id="background" style="position:absolute;top:0;left:0;right:0;bottom:0;background-color:red;filter: blur(3px);z-index:-1;"></div>
    <div id="textarea">My Text</div>
</div>

如果您看到背景屏蔽内容,则使用the z-index property发送第二个内容div后面的背景.