如何仅使用CSS创建自定义的鸡蛋状弯曲形状？

问题描述

我要创建这种自定义白色形状，而在CSS中没有购物车图标。我该怎么办？

解决方法

使用边界半径

赞

border-radius:70% 30% 30% 70% / 60% 40% 60% 40%;

类似图片

enter image description here

演示

.cart-div{
  background:#2c44a3;
  width:200px;
  height:200px;
  padding:50px;
}
.shape{
  background:#fff;
  width:180px;
  height:180px;
  color:#111;
  border-radius:58% 42% 63% 37% / 35% 31% 69% 65%;
  display:flex;
  align-items:center;
  justify-content:center;
}

<div class="cart-div">
  <div class="shape">
  cart icon
  </div>
</div>

可以制作不同的形状吗？访问here