vw,vh,rem,em,ch,vmax,vmin 单位详解

 1. vw  相对于视口的宽度。视口被均分为100单位的vw      1vw = (视口宽度)/100    

h1{
  font-size: 8vw
}

如果视口的宽度是200px，那么上述代码中h1元素的字号将为16px，即(8x200)/100.

 

2.vh  与vw一样，只不过把宽变成了高

 

3.vmax  相对于视口的宽度或高度中较大的那个。其中最大的那个被均分为100单位的vmax

计算方式和vw,vh一样，只是取宽高中较大的一个为标准

 

4.vmin  参考vmax

 

5.ch  数字“0”的宽度

1ch = 页面中1个数字‘0’的大小

 

6.em  相对长度单位。相对于当前对象内文本的字体尺寸。

1em =当前元素的font-size,

如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。

 

7.rem  相对长度单位。相对于根元素(即html元素)font-size计算值的倍数

1rem = html的元素的font-size

如果没有设置，则相对于浏览器的默认字体尺寸