rem大家或许都比较熟悉,而rpx则是腾讯在公测小程序时所推崇;二者实质并无太大的区别,在很多的小白前端开发阶段会不懂为什么一些老前端在开发移动端过程中会出现部分地方不使用rem或者rpx而转用px,接下来谈谈我的看法:
一般开发中横向布局通常使用rem/rpx布局,纵向布局部分使用px
第一种情况
(适用于一行布局中多个元素布局)

1. 这里以上图为例,因为每一台手机的屏幕横向的大小是固定的,如果使用px则可能在小屏幕出现位置不可控,导致内容换行错乱等问题。故使用rem/rpx单位布局。
2.而手机纵向的高度是无限延伸的,所以上下边距和边框等则可以使用px固定像数,这样不会对页面效果产生太大影响,而且也不用担心元素不可控错乱等问题。
第二种情况
(适用于一行中单元素或者左右两端的小型元素布局)

1. 同样一上图为例,对于这样的单元素或者左右小元素,可以选择px固定尺寸,原因是当横行布局只有一个元素时根本不会产生错乱,因为屏幕的宽度远大于这点小元素的宽度,如果产生错乱则可以放弃该手机适配了(这种小屏幕早该淘汰了)。
2. 纵向布局原理与上面一致。
本文章仅代表个人开发观点,实际情况实际分析,如果还是不懂就记住一句话:发生错乱就必须使用rem或者rpx布局;围绕此观点就不会有错。如果有错误还望各位大师指出,这也是我第一次写文章,多多指教。
网友评论