解决方法
我能得到的最接近的是这只使用css.
.one {
position: absolute;
top: 22px;
left: 19px;
width: 230px;
height: 180px;
background: #0F1E3C;
border-radius: 100%;
clip: rect(70px,auto,45px);
transform:rotate(90deg);
}
.one:before {
content: '';
position: absolute;
top: -15px;
left: -62px;
width: 200px;
height: 200px;
background: white;
border-radius: 100%;
}
.two {
position: absolute;
top: 156px;
left: 59px;
width: 230px;
height: 180px;
background: #0F1E3C;
border-radius: 100%;
clip: rect(70px,45px);
transform:rotate(-90deg);
}
.two:before {
content: '';
position: absolute;
top: -15px;
left: -62px;
width: 200px;
height: 200px;
background: white;
border-radius: 100%;
}
<div class="one"></div> <div class="two"></div>
