px,rpx,em,rem,vw/vh,百分比的区别？

px:

• 绝对长度单位,当浏览器页面缩放时，px 并不能跟随变大。当前网页的布局就会被打破。

rpx:

• rpx是微信小程序独有的、解决屏幕自适应的尺寸单位;
• 可以根据屏幕宽度进行自适应，不论大小屏幕，规定屏幕宽为 750rpx
• 通过 rpx 设置元素和字体的大小，小程序在不同尺寸的屏幕下，可以实现自动适配

rpx 和 px之间的区别：

• 在普通网页开发中，最常用的像素单位是px
• 在小程序开发中，推荐使用 rpx 这种响应式的像素单位进行开发

em:

• 相对长度单位，em 是相对于当前元素的父元素的 font-size 进行计算,如果当前元素未设置则相对于浏览器的默认字体尺寸。

<div class="a">A
    <div class="b">B
        <div class="c">C</div>
    </div>
</div>

<style>
 .a{ font-size:16px;}
 .b{ font-size:2em;} /* 相当于32px */
 .c{ font-size:1em;} /* 相当于32px */
</style>

标签：em,vh,rpx,px,屏幕,font,size
来源： https://www.cnblogs.com/zhanghaoqing/p/16451315.html