绝对长度单位
-
px
px，pixel，像素。是显示屏上显示的每一个小点，为显示的最小单位。
-
pt
磅，1pt = 1/72 英寸
-
in
英寸，1in = 96px
-
cm
厘米，1cm = 37.8px
-
mm
毫米，1mm = 3.78px
相对长度单位
-
百分比（%）
是一个相对长度单位，描述的是相对于父元素的百分比值。
-
em
em，相对于当前对象内文本的字体大小。
如，body的font-size设置为12px，则对于body内部的子元素而言，1em = 12px。
但是要注意一点，em的大小依据于父元素的字体大小。当存在多层元素嵌套时，每一个div都将从父元素继承字体大小，并逐层增加。
-
rem
rem，"r"="root"，意思是1rem等于root元素的字体大小。大部分情况下，根元素等于html元素。
-
ch & ex
ch 和 ex，基于字体的度量单位，依赖于当前设定的字体。
ch，通常被定义为数字0的宽度，这个单位的传统用途主要是盲文的排版。
ex，定义为当前字体的小写x字母的高度（x-height）或者 0.5em。
-
vh & vw
其中，v 代表 viewpoint（视口）。
我们可以利用vh 和 vw 来参考使用视口的高度和宽度。
假设视口的宽度和高度分别为150px，250px
1vw = 150/100 px
1vh = 250/100px
-
vmin & vmax
同样也是依据于视口的高度和宽度。
vmin和vmax是关于视口高度和宽度两者的最小或者最大值。
假设视口的宽度和高度分别为120px，260px
1vmin = 120/100 = 1.2px
1vmax = 260/100 = 2.6px
网友评论