什么是px,rpx,em,rem

本文介绍了网页设计中常见的尺寸单位,包括px的固定大小特性,rpx作为微信小程序的自适应单位,em的相对父元素font-size的特性,以及rem的相对于根元素html的统一调整优势。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1、px

1)px就是pixel的缩写,意为像素。

2)px就是设备或者图片最小的一个点,比如常常听到的电脑像素是1024x768的,表示的是水平方向是1024个像素点,垂直方向是768个像素点。

3)px是我们网页设计常用的单位,也是基本单位。

4)通过px可以设置固定的布局或者元素大小。

5)缺点:没有弹性。

2、rpx

1)rpx 是微信小程序解决自适应屏幕尺寸的尺寸单位。

2)rpx(responsive pixel): 可以根据屏幕宽度进行自适应。

3)微信小程序规定屏幕的宽度为750rpx。

4)解释:例如宽度,相当于把屏幕宽度分为750份,1份就是1rpx。高度类似~

3、em

1)参考物是父元素的font-size,具有继承的特点。

2)如果自身定义了font-size按自身来计算(浏览器默认字体是16px),整个页面内1em不是一个固定的值。

3)特点是1. em的值并不是固定的; 2. em会继承父级元素的字体大小。

4)1em=1倍父元素font-size的值,2em=2倍父元素font-size的值,以此类推……

4、rem

1)rem是相对于根元素html,这样就意味着,我们只需要在根元素确定一个参考值,可以设计HTML为大小为10px,到时设置1.2rem就是12px.以此类推。

2)优点是,只需要设置根目录的大小就可以把整个页面的成比例的调好。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值