这种背景使用css3如何实现

Question

这种背景使用css3如何实现

Answer 1

You can use: after to achieve it. I don’t know if it is the effect you want. I hope it will be helpful to you

.main {
            background: #7272ff;
            position: relative;
            width: 400px;
            height: 150px;
        }
        .main:after {
            content: '';
            background: #fff;
            width: 128%;
            height: 300px;
            position: absolute;
            top: 26px;
            left: -14%;
            border-radius: 50%;
        }
<p class="main"></p>