swiper-item中的图片如何进行居中显示?

小程序 文章 2021-03-06 21:21 1024 0 全屏看文

AI助手支持GPT4.0

swiper-item中的图片如何进行居中显示?How to center the picture in swiper-item?

swiper-item中的图片如何进行居中显示?

如题。

Such as the title.

回答:

携企网络科技:

margin:0 auto;text-align:center;都可以居中吧!

垂直居中一般css用:vertical-align: middle;

自动识别图片尺寸用这个:

    imgHeight:function(e){

      var winWid = wx.getSystemInfoSync().windowWidth; //获取当前屏幕的宽度

      var imgh=e.detail.height;//图片高度

      var imgw=e.detail.width;//图片宽度

      var swiperH=winWid*imgh/imgw + "px"//等比设置swiper的高度。 即 屏幕宽度 / swiper高度 = 图片宽度 / 图片高度  ==》swiper高度 = 屏幕宽度 * 图片高度 / 图片宽度

      this.setData({

        Height:swiperH//设置高度

      })

    },

黑夜白昼:
display: flex; flex-direction: row; justify-content: center; align-items: center;
小林:登录吃鸡

-EOF-

AI助手支持GPT4.0