微信小程序> 小程序常用单位解释大全

小程序常用单位解释大全

浏览量:766 时间: 来源:lw_waston

小程序现在应用到的单位越来越多,我们经常会搞不清楚他们的含义。所以我就参考网上众多博主的文章,整理了一个文档专门对各个单位进行解释。
1 pt
单位名称为点(Point),绝对长度单位。1pt=1/72英寸,常用于印刷当中,在AI、PS等设计软件当中字体大小所用的单位就是pt,它在广告印刷业当中十分受欢迎,也非常的好用。但现在在网页当中,pt几乎不出现了。使用pt定义文字,当用户设置超过96DPI(转化公式:px = pt * DPI / 72)的值,数值越大,字体就越大。
2 px
单位名称为像素,相对长度单位,像素px是相对于显示器屏幕分辨率而言的。像素的使用性特别广。使用px定义文字,无论用户怎么设置,都不会改变大小。
3  em
单位名称为相对长度单位。它没有一个固定数值,支持小数点后三位数,相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置,则相对于浏览器的默认字体尺寸。需要注意的是:若父级单位用了em,且设置了文本大小,这父级大小会随文本大小而改变,会继承父级元素的字体大小。
4 rem
是CSS3新增的一个相对单位(root em,根em),是相对HTML根元素。通过它既可以做到只修改根元素就可以成比例地调整所有字体大小,又可以避免字体大小逐层复合的连锁反应。 目前,除了IE8及更早版本外,所有浏览器均已支持rem。

5  视口单位
vw:1vw = 视口宽度的1%
vh:1vh = 视口高度的1%
vmax:vmax选取vw和vh中最大的那个.
vmin:vmin选取vw和vh中最小的那个.
6  rpx
rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。微信小程序也支持rem尺寸单位,rem和rpx的换算关系:rem: 规定屏幕宽度为20rem;1rem = (750/20)rpx注:开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准。设备宽度750px比较容易计算750px的话1rpx=1px,这样的话,设计图上量出来的尺寸是多少px就是多少rpx,至于在不同的设备上实际上要换算成多少个rem就交给小程序自己换算。
7 ch
这个ch 单位是由CSS3规范引入的一个新单位,表示“0”字形的宽度。它应该是最不为人知的一个新单位,因为在绝大多数场景下,我们并不关心0 这个字符显示出来到底有多宽。但对等宽字体来说,这是个例外。在等宽字体中,“0”字形的宽度和其他所有字形的宽度是一样的。
8 ex
ex单位被定义为”当前字体的x-height或者一个em的一半”。给定的字体的x-height是指那个字体的小写x的高度。通常,这是这个字体的中间的标志。x-height:小写字母x的高度(阅读更多关于The Anatomy of Web Typography)ex单位在css1中已经存在,但是你不会找到对ch单位有像这样坚实的支持。具体支持,在Eric Meyer’s 的博客中查看CSS单位和值。

9  pc
绝对长度单位。派卡(Pica)。相当于我国新四号铅字的尺寸。
in = 2.54cm = 25.4 mm = 72pt = 6pc

10 in
绝对长度单位。英寸(Inch)。
1in = 2.54cm = 25.4 mm = 72pt = 6pc

11  mm
绝对长度单位。毫米(Millimeter)。
1in = 2.54cm = 25.4 mm = 72pt = 6pc

12 cm
绝对长度单位。厘米(Centimeter)。
1in = 2.54cm = 25.4 mm = 72pt = 6pc

13 fr
css fr 单位是一个自适应单位,fr单位被用于在一系列长度值中分配剩余空间,如果多个已指定了多个部分,则剩下的空间根据各自的数字按比例分配。

  以上内容 参考链接:                     https://www.jianshu.com/p/f9b34885609d                                        https://www.cnblogs.com/913815ccmm/p/4858638.html                                         http://caibaojian.com/fr.html

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎