px与rpx换算

rpx是微信小程序中css的尺寸单位，可以根据屏幕宽度进行自适配。

规定屏幕宽度为750px，譬如宽哗拿iphone6，屏幕宽度为375px，共慎搭有750个物理像素，则1rpx = 0.5px。

设备rpx换算px：屏幕宽度/750，px换算成rpx:750/屏幕宽度芦尺；

iPhone5 1rpx = 0.42px      1px = 2.34px ；

iPhone6 1rpx = 0.5px 1px = 2rpx ；

iPhone6s 1rpx = 0.552px 1px = 1.81rpx；

开发者可以通过设计稿基准宽度计算页面元素丛码漏 rpx 值，设计稿 1px 与框架样式 1rpx 转换公式如下：

设计稿 1px / 设计稿基模陪准宽度 = 框架样式 1rpx / 750rpx

换言之，页面元素宽度在 小程序 中的宽度计算公式：

750 * 元素在设计稿中的宽度 / 设计稿基准宽度

举例说明：

若设计稿宽度为 750px，元素渗烂 A 在设计稿上的宽度为 100px，那么元素 A 在 小程序 里面的宽度应该设为：750 * 100 / 750，结果为：100rpx。

若设计稿宽度为 640px，元素 A 在设计稿上的宽度为 100px，那么元素 A 在 小程序 里面的宽度应该设为：750 * 100 / 640，结果为：117rpx。

若设计稿宽度为 375px，元素 B 在设计稿上的宽度为 200px，那么元素 B 在 小程序 里面的宽度应该设为：750 * 200 / 375，结果为：400rpx。

小程序开发尺寸是rpx（responsive pixel），可以实现一稿适配所有屏闷搜幕尺寸，小程序编译后，rpx会做一次px换算。换算是以375个物理蚂颤历像素为基准，也就是在一个宽度为375物理像素的屏幕下，1rpx = 1px。这里了解就行，设计稿尺寸375px或750px都没问题。在不同的设备下，rpx换算成不同的px，意思就是在开发小程序时，只需要按照标准设计设置好尺寸（洞并多少rpx），小程序会根据对应的设备，计算出应该显示的尺寸（多少px），所以开发时只需要按照标准规则写，就可以适配不同的设备。

---