美文网首页
小程序(响应式像素rpx)与px

小程序(响应式像素rpx)与px

作者: Egde | 来源:发表于2018-01-05 15:59 被阅读0次

    首先简单说px是抽象的css单位,一个px在不同的设备下有不同的物理像素(换算由浏览器操作)。是浏览器提供的统一的标准单位,使在不同设备下有相同的效果

    小程序设定不同大小的手机屏幕宽度都是750rpx,rpx可以根据屏幕真实宽度自适应

    以iphone 6屏幕为例。i6屏幕宽度375px.小程序里宽度750rpx, 365px = 750rpx.比例是1 : 2。不出意外UI都会以i6为标准做设计

    在小程序的页面中可以通过getApp()获取小程序的实例,该实例中有一个systemInfo属性,包含了systemInfo{pixelRatio, radio, screenHeight, screenWidth, windowHeight, windowWidth, ....}其中radio就是px/rpx(i6为375/750=0.5), pixelRadio是rpx/px的值(i6为750/375=2)。有时候知道这些很有用,这也是我遇到问题才来整理的。

    相关文章

      网友评论

          本文标题:小程序(响应式像素rpx)与px

          本文链接:https://www.haomeiwen.com/subject/tehsnxtx.html