css如何绘制内凹的弧线

原理

原理就是用伪类元素把线旁边添加一个border-radius弧度的和背景色相同颜色的椭圆，把内凹的弧度重叠出来。

代码

    #circleline {
   	  margin-top:25vh;
	  background-color: cornflowerblue; 
	  position: relative;
	  opacity: 0;    
	  padding: 10vh;
    }
    #circleline::before {
	    left: 0;
	    right: 0;
	    width: 100%;
	    border-radius: 50%; // 控制弧度效果 越大弧度越自然
	    background: #f35c5c;
	    content: "";
	    height: 10vh; // 控制椭圆高度
	    position: absolute; // 关键***
    }