filter: blur() 高斯模糊效果

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/kangkang_style/article/details/88726181

比较喜欢的效果实例：
	<div class="lbg">
      	    <img src="../../assets/01.jpg" class="test-img">
        </div>
	
	.lbg{
		/* 设置相对定位 */
		position: relative;
		/* 宽度120%，-10%让元素集中 */
		left: -10%;
		/* 为了实现椭圆效果 */
		width: 120%;
		height: 130px;
		/* 只设置左下角和右下角的圆角 */
		border-radius: 0 0 80% 80%;
		overflow: hidden;
	}
	/* 内层显示的图片 */
	.lbg img{
		width: 100%;
		height: 100%;
		/* 设置高斯模糊 */
		filter: blur(2px);
		overflow: hidden;
	}

CSS使用filter: blur(20px);实现高斯模糊效果，周边会出现扩展的白边；
    解决方案：
        对父元素设置overflow: hidden; 隐藏即可。