微信小程序> 小程序怎么处理2x,3x图?

小程序怎么处理2x,3x图?

浏览量:7049 时间: 来源:冷子夜

1.wxss的解决办法(推荐)

@media  (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio: 2){  .imgTest{    background: url(../images/2x.png) no-repeat;   } }  @media  (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3){  .imgTest{    background: url(../images/3x.png) no-repeat;   } } 

2 js方法

获取设备的设备像素比,在wxml上src动态用变量引用图片

//获取设备像素比const getPixelRatio = () => {  let pixelRatio = 0  wx.getSystemInfo({    success: function (res) {      pixelRatio = res.pixelRatio    },    fail: function () {      pixelRatio = 0    }  })  return pixelRatio}

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎