在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
在使用uni-app实现小程序的时候,设置左图的右圆角不生效,样式也都没有问题,在模拟器上也可以正常现实,手机上样式出现差别,现有以下解决方法: 设置整个圆角,然后左边使用margin-left:-30upx,隐藏左边多余的圆角
代码如下: <cover-view class="video-mask-btn"> <cover-view class="video-mask-btn-left"> 视频步骤 </cover-view> <cover-view class="video-mask-btn-right"> 图片步骤 </cover-view> </cover-view>
.video-mask-btn-left,.video-mask-btn-right { width: 180upx; height: 60upx; line-height: 60upx; background: rgba(0,0,0,0.4); text-align: center; color: #FFFFFF; font-size: 35upx; border-radius: 30upx; } .video-mask-btn-left { padding-left: 30upx; margin-left: -30upx; } .video-mask-btn-right { padding-right: 30upx; margin-right: -30upx; }
.video-mask-btn-left { padding-left: 30upx; margin-left: -30upx; } .video-mask-btn-right { padding-right: 30upx; margin-right: -30upx; }
|
请发表评论