前端的长度单位有哪些

首先在前端开发中,会遇到各种不同类型的长度单位,而整体的长度单位分为两大类:绝对长度和相对单位。

1.绝对单位

1.px 像素(Pixel)

px 的最小单位是1,所以小数的度量没有意义

2. pt(point镑)

物理长度单位。指的是72分之一英寸。pt=1/72(英寸),px=1/dpi(英寸)

2.相对单位

1.em

相对于所在容器的font-size属性,若自身没有设置font-size属性,则相对于浏览器的默认字体尺寸。
一般浏览器默认字体大小是16px, 则1em = 16px, 2em = 32px

2.rem

相对于整个html的font-size属性。

3.vw vh

对于视窗(viewpoint)的宽度或者高度。1vw等于视窗宽度的1%,1vh等于视窗高度的1%。
视口被均分为100单位的vw,若屏幕宽375px,1vw=3.75px;视口被均分为100单位的vh,屏高1200px,1vh=12px;

4. %百分比
5.vmin 和 vmax

vmin是当前 vw 和 vh 中较小的一个值,vmax是当前 vw 和 vh 中较大的一个值。

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

程序媛夏天

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值