大白话解释css的各种单位px、em、rem、vh、vw【大白话讲代码】系列荣誉出品

> 学习要从 是什么？为什么？怎么样？角度考虑问题

是什么

css的单位，就是规定了盒子的大小，是米啊还是厘米啊？只不过不用这些米之类的

用的最多的是 `px` ，也就是像素，

# 为什么

可是为了应付不同的场景，也出现了众多不同的单位

知道常用的就行了，就可以应对95%以上的开发需求了 **px、em、rem、vh、vw**

具体看看

%

% 很常见，要注意的是，设置某个东西的百分比，**要保证它父盒子是有大小的**

px

px就是像素，就是，一个小点就是一个像素

它是固定的，你写个100px，**是多大就是多大，你把屏幕拉大拉小，它不变**，这个很重要！

em

em 和之前最不同的一点是 **它的大小不是固定的，是随着别人改变的**，这个 **别人**指的是，当前文本大小，这个大小是自己设置的，这个大了，他就大

rem

rem和em差不多，你就知道，rem是相对根标签的大小作为这个**别人**。

简单的说，就是他俩参照的这个 **别人** 不是一个人

vh、vw

这俩兄弟很牛批！

根据视口来的，视口就是你屏幕宽高，做响应式很方便

但是要区分这俩兄弟和%的区别