uni-app 自定义轮播图 swiper 指示点位置
项目需要把指示点位置上移,否则会被按钮遮盖
<view class="imgs">
<swiper class="swiper screen-swiper square-dot"
style="height: 634rpx;width: 686rpx;border-radius: 20rpx;z-index: -1;"
indicator-dots
autoplay
:interval="5000"
:duration="500">
<swiper-item v-for="(item, index) in indexInfo.banner" :key="index">
……
</swiper-item>
</swiper>
</view>
//设置轮播的指示点位置
.swiper {
/deep/ .uni-swiper-dots { // 指示点整个区域
// bottom: 100rpx;
}
}
.imgs {
padding:0 32rpx;
margin-top: 150rpx;
border-radius: 20rpx;
position: relative;
//设置line-height即可改变小程序端指示点的位置
line-height: 90rpx;
}
设置line-height即可改变小程序端指示点的位置,当然可能会影响imgs盒子中其他元素的行高,按需要设置即可
上一篇:
uniapp开发微信小程序-2.页面制作
