<div class="wrapper">
  <div class="left">
  </div>
</div>
.wrapper {
/*   position: relative; */
  width: 800px;
  height: 375px;
  background: #FFEDE0;
  border: 1px dashed red;
  overflow: hidden;
}

.left {
  position: relative;
  left: -175px;
  width: 560px;
  height: 100%;
  background: #FFD1AE;
  border-right: 20px solid white;
  border-radius: 0 50% 50% 0;
  transform: scaleX(.4)
}
// 这里勉强实现了一个类似的场景
// 但是所有的参数都需要详细调整,在当前场景下不易使用

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.