小程序是一个跨系统的平台，虽然不用区分版本的不同，但是小程序在不同的设备上运行，会出现不同的分辨率，如何使小程序在不同的设备上保持正常的视觉元素，使界面更加的适配，是小程序进行优化时需要考虑的问题。
小程序是一个跨系统的平台，虽然不用区分版本的不同，但是小程序在不同的设备上运行，会出现不同的分辨率，如何使小程序在不同的设备上保持正常的视觉元素，使界面更加的适配，是小程序进行优化时需要考虑的问题。小程序之所以能够在分辨率不同的设备上保证视觉元素的正常显示，是因为rpx(微信小程序中CSS的尺寸单位)的动态尺寸单位的作用。对于很多人来说，都会理解像素:“在显示屏上，每一个画面都是由无数的点阵形成的。这个点阵中，每一个点叫作像素，就是 pixel(缩写为px)”。
但是随着视网膜屏的推出和高分屏的普及，px所能代表的实际长度就会发生改变。单纯地使用pX并不能满足需求，小程序元素很难保证在不同设备上的正常显示。即使是同样的px尺寸的元素，在高分屏上的显示要比低分屏小很多。
在这种情况下，小程序需要的是一个动态的长度单位，这个长度单位还能够对不同的屏幕的分辨率进行调整和适配，以保证所有元素在不同的屏幕上的展示都是一样的。
在微信的官方文档中，有这样的一句话:在 iphone6上，屏幕宽度为375pX，共有750个物理像素，则750mpx=375px=750物理像素，1rpx=0.5px-1物理像素。也就是说，微信小程序的设计师可以把 iphone6的界面作为视觉稿的标准。
小程序设计师在设计小程序的时候，就可以直接利用 iphone6(375X667)的屏幕尺寸作为视觉稿尺寸，然后以1px=2rpx的标准，将设计稿件设定为 750×1334。
当小程序的设计稿交给程序员之前，小程序设计师需要描述好稿尺寸和单位换算标准，从而能够帮助程序员快速实现界面正常的效果。
其实，从小程序的界面适配上也可以看出，微信小程序放到电脑上运行，屏幕的宽度很可能会发生变化，以宽度为基准，最后很容易出现元素显示不全面的情况。
另外，微信官方不希望小程序在除了手机以外的设备上运行，因此对于开发者来说，可以把全部的注意力集中在手机上，不需要担心手机屏幕的尺寸大小带来的界面适配问题。
原来的小程序在安卓手机中某些屏幕分辨率下，出现了一些遮挡的漏洞，部分元素的大小也不能符合人的视觉习惯。在进行优化之后，小程序的界面进行了进一步的适配，漏洞被补充，元素的字体大小也得到调整。
虽然说小程序已经基本适应不同的版本和不同的手机型号，但是从细节上来看，还会出现一些差别，这还是会带给用户一山些不适体验，因此，要对界面进行优化，使小程序能够适配不同的屏幕。
可能您还想看