css1vh等于多少px,css单位px、rem、em、vw、vh

css单位有两种分为相对单位和绝对单位

绝对单位有:px

相对单位有：rem、em、vw、vh

下面我们一起来了解这几个单位吧。

1、rem：相对根元素字体大小来计算

1rem默认为16px当根元素有font-size时1rem的单位则是font-size的大小

下面我们看这个例子

html{

font-size: 20px;

}

.rem {

width: 20rem;

height: 20rem;

background: green;

}

所以此时.rem的宽高为400px；

2、em：根据父节点的字体大小计算

其实em和rem相似，不过rem是相对根元素，而em是相对父元素的

下面我们来看这个例子

.rem {

font-size: 30px;

}

.em{

width: 20em;

height: 20em;

background-color: purple;

}

所以此时em的宽高为600px；

3、vw：视口宽度， 将视口宽度的1%

vh：视口高度， 将视口高度的1%

这两个不太常用，大家了解一下就可以。

今天就到这里吧，再见！