先是一寫元素，再給這個元素設置樣式和僞類樣式
<view class="pure_top"></view>
比如說這個pure_top元素(因爲這裏是小程序所以用的是view，h5也是一樣實現的啦)，我設置的樣式如下:
.pure_top {
width: 100%;
height: 100px;
position: relative;
z-index: -1;
overflow: hidden;
}
.pure_top::after {
content: '';
width: 140%;
height: 100px;
position: absolute;
left: -20%;
top: 0;
z-index: -1;
border-radius: 0 0 50% 50%;
background: #1496f1;
}
如何在元素後追加一個after，當然是元素自身定位爲relative，僞類設置content:‘’，並相對定位爲absolute，再設置下left ,top 值，使僞類元素的位置擺放的合理就行了。
這裏需要注意的是我把z-index值設爲-1，因爲弧形一般是作爲背景圖的，所有層級自然要放低些。
上面的僞類.pure_top::after { content: '';width: 140%;}寬度爲140%，難怪弧度那麼大呢？半徑越大，弧度就越大，那我們可以減小半徑來達到變小弧度的需求