内嵌的h5是vue页面

我需要底部的按钮能覆盖map组件，用的cover-view,但是cover-view不支持背景渐变色的样式，比如底部的在线预约在真机上不显示，另外，我设置的 border-radius:40rpx 0 0 40rpx;在真机上的显示的四个角全部圆角了 <cover-view class='bot'>     <cover-view class='bot-con'>       <cover-view class="sc {{sc == 1?'cur':''}}"   bindtap='collect'>         <cover-image class='d-sc' src="../../images/{{sc == 1?'mysc':'shoucang'}}.png"></cover-image>         <cover-view class='collect'>收藏</cover-view>       </cover-view>       <cover-view class="btns {{detail.status==1?'disable':''}}">         <cover-view class="{{detail.status==1?'dis':'none'}}"></cover-view>         <cover-view class='tel-order' data-tel="{{detail.guanjia.mobile}}" bindtap='call'>电话预约</cover-view>         <cover-view class='nav online-order' bindtap='lineCollect' >在线预约</cover-view>       </cover-view>     </cover-view>   </cover-view> .online-order{-webkit-border-radius:0 40rpx 40rpx 0;-moz-border-radius:0 40rpx 40rpx 0;border-radius:0 40rpx 40rpx 0;height:80rpx;line-height:80rpx;color:#fff;-webkit-background-image:-webkit-gradient(linear,0% 0%,100% 0%,from(#ffca4d),to(#fd9840));-moz-background-image:-webkit-gradient(linear,0% 0%,100% 0%,from(#ffca4d),to(#fd9840));-o-background-image:-webkit-gradient(linear,0% 0%,100% 0%,from(#ffca4d),to(#fd9840));background-image:-webkit-gradient(linear,0% 0%,100% 0%,from(#ffca4d),to(#fd9840));}