tabbar 被购物车结算遮挡
在小程序上tabbar没有将固定栏遮挡,如果直接调高,浏览器H5页面是对了,但在小程序上面离底部的定位就太高了
- 原代码
// 底部结算样式
.shop-foot {
border-top: 2rpx solid #F7F7F7;
background-color: #FFF;
position: fixed;
bottom: 0; // 这里给 bottom:0 H5 直接看不见了
left: 0;
justify-content: space-between;
align-items: center;
width: 100%;
height: 100rpx;
display: flex;
}
// 购物车样式
.shop-item {
display: flex;
padding: 20rpx;
align-items: center;
background-color: #F7F7F7;
margin-bottom: 10rpx;
.shop-image {
width: 200rpx;
height: 180rpx;
}
.shop-text {
flex: 1;
}
.shop-color {
margin-top: 10rpx;
font-size: 28rpx;
}
.shop-price-num {
margin-top: 10rpx;
display: flex;
justify-content: space-between;
}
}
- 修改参数 bottom 这样就能看见了
bottom: var(--window-bottom,0);