css设置背景模糊

 要是直接在要设置模糊背景色的div里使用filter 就会造成文字和里面的图片都会被模糊化

	.bgc{
		height: 300px;
		position:relative;
		background: #8c8c45;
		filter: blur(15px);
}

css设置背景模糊_第1张图片

这里需要在需要设置背景的div的伪类里来设置filter  这样就不会文字也模糊化了

	.bgc{
		height: 300px;
		position:relative;
		&:before{
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			background: #8c8c45;
			width: 750rpx;
			height: 300px;
			filter: blur(15px);
			// z-index: -1;
		}
}

css设置背景模糊_第2张图片

你可能感兴趣的:(HTML+CSS,css,前端,javascript)