1==》如何让轮播的宽度100%显示？ 你先给swiper 外面添加一个大盒子,给大盒子一个类 。 <view class='lunbobox'> 然后wxss 里面设置 image , 100%; 在设置大盒子的宽度 100%; 这样就可以了. <view class='lunbobox'> <!-- 轮播开始 --> <swiper indicator-dots="{{indicatorDots}}" circular autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}"> <swiper-item> <image src="{{item}}" class="slide-image" width="750" height="150"/> </swiper-item> </block> </swiper> <!-- end --> </view> 设置盒子的宽度 图片的宽度 让图片100%显示 .lunbobox{ 750rpx; } .slide-image{ 100%; } 2==》轮播的基础配置项 circular表示是否衔接 后面不要加true哦 <swiper indicator-dots="{{indicatorDots}}" circular autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}"> <block wx:for="{{imgUrls}}"> <swiper-item> <image src="{{item}}" class="slide-image" width="750" height="150"/> </swiper-item> </block> </swiper> // 轮播 imgUrls: [ 'https://images.unsplash.com/photo-1551334787-21e6bd3ab135?w=750', 'https://images.unsplash.com/photo-1551214012-84f95e060dee?w=750', 'https://images.unsplash.com/photo-1551446591-142875a901a1?w=750' ], indicatorDots: true, //是否显示小圆点 true显示 autoplay: true, //是否自动播放 true自动播放 interval: 5000, //播放的间隔 duration: 1000, //滑 动动画时长 03==》跳转使用 它在导航里面的哦 <navigator></navigator> navigator标签类似于a标签，它里面是可以包含view标签的 04==》如何循环三个导航链接 ps: wx:for="{{labs}}" 循环的语法 labs是被循环的数组 注意有双引号 item是循环的每一项 <navigator url="../list/list" hover-class="navigator-hover" wx:for="{{labs}}"> <view>{{item.title}}</view> </navigator> // 导航链接的数据 labs: [{ id: 1, title: "haha1" }, { id: 3, title: "haha2" }, { id: 3, title: "haha3" }]
05==》css3 一个在最左最右 /* 导航 */
.daohangbox{
display: flex;
justify-content: space-between; //巧记两者之间 between说明一个在左一个在右
}