css实现卡券半圆的样式（⼩程序）1.实现效果：
2.如何实现：
思路：写左半圆和右半圆（position：absolute） 放⾄上⼀层上⾯（position:relative)
代码：
wxml⽂件：
<view class="content-fenge">
<view class="circle1"></view>
<view class="fenge"></view>
<view class="circle2"></view>
</view>
wxss⽂件：
.content-fenge{
position: relative;
height: 124rpx;
width: 100%;
margin: 0 auto;
}
.circle1{
position: absolute;
width: 26rpx;
height: 52rpx;
border-radius: 0 26rpx 26rpx 0;
background-color: #E5E5E5;
top: 50%;
transform: translate(0%, -50%);
}
.circle2{
position: absolute;
width: 26rpx;
height: 52rpx;
border-radius: 26rpx 0 0 26rpx;
background-color: #E5E5E5;
right: 0;
top: 50%;
transform: translate(0%, -50%);
写文章的小程序
}
.fenge{
position: absolute;
width: 640rpx;
margin: 64rpx auto;
border-bottom: 4rpx dashed #78C5FF;
left: 0;
top: 0;
right: 0;
bottom: 0;
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。