前端必看！css中常用单位及区别

作为一名前端开发人员，我们在编写css的时候常需要使用到单位，那么常用的单位有px、%、em、rem、vw、vh、vmin、vmax等，虽然有的是很常用的单位，但是他们代表的意义各不相同，让我们来了解一下他们之间的区别吧！
常用的单位共分为两大类，一类叫绝对单位，一类叫相对单位
绝对长度单位是固定的，用任何一个绝对长度表示的长度都将恰好显示为这个尺寸。
相对长度单位规定相对于另一个长度属性的长度。相对长度单位在不同渲染介质之间缩放表现得更好。
一、固定单位：
1、px（pixel）像素通常在不定义显示缩放比例的情况下，1px对应显示器屏幕上的一个像素点，对于高清屏则对应更多。它做不到自适应的效果。早些时候pc端页面开发基本都使用像素这个单位。
二、相对单位
1、%（百分比）浏览器根据其父级元素的样式来计算值。父元素改变的时候，子元素大小自动改变。
2、em：相对于父元素的字号大小来计算值，当元素自身有字号大小时，则按照元素自身字号大小来计算值。通常情况下浏览器默认字号大小为16px，则2em = 32px
当父元素自身没有设置字号大小

当父元素设置字号大小并且子元素自身有字号大小

3、rem：rem(root em)是相对于根目录字号大小进行计算。一个页面有且只有一个根目录html。

4、vw：vw(viewpoint width)视口宽度，可以理解为整个屏幕宽为100vw，那么1vw = 视口宽度的1%，可以达到屏幕自适应。

5、vh：vh(viewpoint height)视口高度，可以理解为整个屏幕高为100vh，那么1vh = 视口高度的1%,可以达到屏幕自适应。

6、vmin：取vw和vh中较小的那一个的值。将窗口最小的一边分为100份，每1vmin是视图窗口最小的一边的1/100。

7、vmax：取vw和vh中较大的那一个的值。将窗口最大的一边分为100份，每1vmax是视图窗口最大的一边的1/100。

以上是开发中常用的单位，欢迎各位小伙伴积极补充！！！