实现内凹园角，阴影，滤镜效果

1、实现内凹圆角

           ![在这里插入图片描述](https://img-blog.csdnimg.cn/20210601103123109.png#pic_center)

                 使用 radial-gradient(320rpx at 80rpx 0px, transparent 80rpx, #F5F6FA 80rpx); ，画出半圆
                 给下面的盒子 ::before { 
					                        content: "";
											display: block;
											position: absolute;
											height: 80rpx;
											width: 80rpx;
											top: -80rpx;
											background-image: radial-gradient(320rpx at 80rpx 0px, transparent 80rpx, #F5F6FA 80rpx);
									  }
			    画出左上半圆。
			        右下的半圆： 1)   使用 border-top-right-radius: 80rpx; 
			                    2) ::after{
										content: "";
										display: block;
										width: 80rpx;
										height: 80rpx;
										bottom: -80rpx;
										right: 0;
										position: absolute;
										background-image: radial-gradient(320rpx at 0 80rpx, transparent 80rpx, #F5F6FA 80rpx);
									}

2、box-shadow: 0 20rpx 20rpx 0 rgba(36, 52, 102, 0.05);
       水平阴影的位置   垂直阴影的位置   模糊距离(可选)    阴影的尺寸(可选)     阴影的颜色(可选)   inset(内部阴影) / outset(外部阴影)（可选）
       
3 、filter （滤镜属性）
            filter:blur(9px);           模糊度
            filter: grayscale(1);       灰度  （是图片为灰色）
            filter: brightness(2.3);    亮度
            filter: contrast(4.4);      对比度
            filter: saturate(3.6);      饱和度
            filter: hue-rotate(185deg);   色相旋转
            filter: invert(1);            反色
            filter: drop-shadow(0px 0px 5px #000);   阴影
            filter: opacity(55%);         透明
            filter: sepia(0.77);          褐色