第一种：::after
<template>
<view>
<view class="bg">
</view>
</view>
</template>
<style>
.bg{
background-color: pink;
}
.bg::after{
content: '';
position: absolute;
width: 160%;
height: 100px;
background: skyblue;
left: -30%;
border-radius: 0 0 50% 50%;
}
</style>
第二种：border-radius
<template>
<view>
<view class="bg">
</view>
</view>
</template>
<style>
.bg{
background-color: pink;
border-radius:0 0 50% 50%/40%;
height: 100px;
width: 160%;
margin-left: -30%;
}
</style>
border-radius:* * /*
border-radius:50% 50%/50%;
height: 200px;
width: 200px;
border-radius:0 0 50% 50%/50%;
height: 200px;
width: 200px;
border-radius:0 0 50% 50%/10%;
height: 200px;
width: 200px;
border-radius:0 0 50% 50%/90%;
height: 200px;
width: 200px;
文章来源：https://www.toymoban.com/news/detail-417562.html
文章来源地址https://www.toymoban.com/news/detail-417562.html
到了这里，关于css-两种画弧线方法的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
