本文已参与「新人创作礼」活动，一起开启掘金创作之路。
大部分前端项目都要求适配各种设备，从laptop到2k，从ios到Android，要适应各种各样的屏幕和分辨率,那今天就来讲一讲CSS当中的各种单位和适配问题。
CSS单位的分类（常用）
绝对单位：
px：viewport像素，浏览器内部对逻辑像素进行再处理的结果
pt：逻辑像素，适应不同屏幕所展示出来的物体视觉尺寸
相对单位：
em：相对于父元素的大小
rem：相对于根元素的大小
vw：相对视口宽度的1%
vh：相对视口高度的1%
分辨率单位：
ppi：每英寸所拥有的像素数目，越大显示的越清晰
在布局当中应该使用什么
在一般情况下，应该遵循大屏幕看到更多更丰富的设计而不是到更“大”的设计，在这种情况下更推荐“px”搭配各种布局手段；但是在实际工作中，通常都是等比例放大或缩小文字、图片即可，这种情况下“rem”或者“vw”搭配各种布局手段会更方便使用。
再说“rem”和“vw”，他们一个是根据跟字体进行等比例缩放，一个是根据视口宽度进行等比例缩放，相比较来说，vw的兼容性要比rem稍微差了一点，但是随着时间的退役，使用不支持版本的手机人数占比也在减少，vw也逐渐在替代rem布局s方式
总结
关于到底应该用什么作为适配的方法才是最优解这个问题，网上也是众说纷纭，我想起来句老话“别管是黑猫白猫，能抓住耗子就是好猫”。在我看来别管是用哪种办法，首先要做的是能够最大程度上满足需求、按时交付，再慢慢研究最适合的解决办法达到自我的提升吧。
