图片:宽度:690 ,高度:340
<template>
<view class="layout">
<view class="banner">
<swiper indicator-dots indicator-color="rgba(255,255,255,0.5)" indicator-active-color="#fff" autoplay circular>
<swiper-item v-for="(item,index) in 3" :key="index" mode='aspectFill'>
<image src="../../common/images/banner2.jpg"></image>
</swiper-item>
</swiper>
</view>
</view>
</template>
<script>
</script>
<style lang="scss" scoped>
.layout{
.banner{
width: 750rpx;
padding: 30rpx 0;
swiper{
width: 750rpx;
height: 340rpx;
&-item{
width: 100%;
height: 100%;
padding: 0 30rpx;
image{
width: 100%;
height:100%;
border-radius: 12rpx;
}
}
}
}
}
</style>
在公共样式加入
view,swiper,swiper-item{
box-sizing: border-box;
}