小程序中swiper与image的使用

最新推荐文章于 2024-06-30 22:07:14 发布

Zhencode

最新推荐文章于 2024-06-30 22:07:14 发布

阅读量423

点赞数

分类专栏：微信小程序文章标签：小程序微信小程序

本文链接：https://blog.csdn.net/Zhencode/article/details/108393424

版权

微信小程序专栏收录该内容

3 篇文章 0 订阅

订阅专栏

/*wxml*/
<swiper>
  <swiper-item><image src="..." mode="widthFix"/>
  </swiper-item>
  <swiper-item><image src="..." mode="widthFix"/>
  </swiper-item>
  <swiper-item><image src="..." mode="widthFix"/>
  </swiper-item>
</swiper>
/*swiper默认宽高100%，150px,image:100%,240px*/
/*wxss*/
swiper{
width:100%;
height: calc(750rpx*图片高度/图片宽度)
}
image{
width: 100%;
height//无需设置，widthFix已经设置高度自适应
}