实际(Android) 以及 预想的 样式是
IOS 显示的 会出现
wxml 代码为：
<cover-view class="foot-box">
<block wx:if="{{line==1}}">
<cover-view class="map_line">
cover-view>
block>
<block wx:elif="{{line==2}}">
<cover-view class="map_line_two">
cover-view>
block>
<block wx:elif="{{line==3}}">
<cover-view class="map_line_th">
cover-view>
block>
<cover-view class="fl1 box-item" bindtap='change_repair'>
<cover-view class='box-num'>112cover-view>
<cover-view class='mt-5'>附近工匠cover-view>
cover-view>
<cover-view class="box-line">
cover-view>
<cover-view class="fl1 box-item" bindtap='change_adviser'>
<cover-view class='box-num'>18cover-view>
<cover-view class='mt-5'>附近工长cover-view>
cover-view>
<cover-view class="box-line">
cover-view>
<cover-view class="fl1 box-item" bindtap='change_site'>
<cover-view class='box-num'>36cover-view>
<cover-view class='mt-5'>附近工地cover-view>
cover-view>
cover-view>
<cover-view class='location' bindtap='user_loc'>
<cover-image class='loc-img' src='/image/dw.png'>cover-image>
cover-view>
wxss 代码为：
.foot-box{
width: 100%;
height: 120rpx;
/* position: fixed; */
position: absolute;
bottom: 0;
text-align: center;
background-color: rgba(255, 211, 80, 0.8);
display: flex;
display: -webkit-box; /* OLD - iOS 6-, Safari 3.1-6 */
display: -moz-box; /* OLD - Firefox 19- (buggy but mostly works) */
display: -ms-flexbox; /* TWEENER - IE 10 */
display: -webkit-flex;
}
.box-item{
color: #333;
font-size: 24rpx;
box-sizing: border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
margin: 10rpx 0;
}
.box-num{
display: block;
color: #000;
font-size: 36rpx;
margin-top: 20rpx;
}
.box-line{
width: 2rpx;
background-color: #fff;
height: 100rpx;
margin: 10rpx 0 0 0;
}
.map_line{
width: 250rpx;
height: 8rpx;
background-color:#303030;
position: absolute;
top: 0;
}
.map_line_two{
width: 250rpx;
height: 8rpx;
background-color:#303030;
position: absolute;
top: 0;
left: 250rpx;
}
.map_line_th{
width: 250rpx;
height: 8rpx;
background-color:#303030;
position: absolute;
top: 0;
left: 500rpx;
}
.location{
width: 80rpx;
height: 80rpx;
/* position: fixed; */
position: absolute;
left: 40rpx;
bottom:170rpx;
}
.loc-img{
position: absolute;
top: 0;
bottom: 0;
width: 80rpx;
height: 80rpx;
}
.yy{
width: 160rpx;
height: 160rpx;
/* position: fixed; */
position: absolute;
left: 40%;
bottom:135rpx;
}
.yy_img{
position: absolute;
top: 0;
bottom: 0;
width:160rpx;
height: 160rpx;
}
求 解决！！
