CSS一条语句实现弧形底部

基础知识：

border-radius:为元素添加圆角边框。
border-radius:10px 20px 30px 40px / 40px 30px 20px 10px
“/”前的四个数值表示圆角的水平半径，后面四个值表示圆角的垂直半径。

实例：

分析：

如上图设计稿，红框是我们需要画的弧线部分，蓝线为垂直半径，黄线为水平半径

假设盒子宽为750rpx，高度为70rpx。

则代码如下

border-radius: 0 0 375rpx 375rpx/0 0 70rpx 70rpx;

还可以使用伪类添加在正常盒子底部

&::after{
     width: 100%;
     height: 70rpx;
     position: absolute;
     left: 0%;
     top: 100%;
     z-index: -1;
     content: '';
     border-radius: 0 0 375rpx 375rpx/0 0 70rpx 70rpx;
     background: #40b368;
    }