1.px、em、rem、vw、rpx之間的區別 · 大雜燴

[TOC] ## **CSS中，自適應的單位都有哪些？** * % 百分比 * vw：相對于視口寬度的單位 * vh：相對于視口高度的單位 * vm：相對于視口寬度或高度（取決于哪個小）的單位 * em：相對于父元素字體大小的單位 * rem：相對于根元素字體大小的單位 ## **px、em、rem、vw、rpx之間的區別（談一下它們的尺寸）** px：**絕對單位**，頁面按精確像素展示 ***** em：**相對單位**，表示相對于父元素的字體大小，1em=16px，整個頁面內1em不是一個固定的值。 **em特征**：1、em值并不固定；2、em會繼承父級元素的字體大小。 ***** 1rem:**相對單位**，表示相對于根元素的字體大小假如根元素有35，若為75，則有75個一個頁面有100個vw，用postcss自動實現適配小程序中一屏有750個rpx > rem就是相對于根元素`<html>`的`font-size`來做計算。而我們的方案中使用`rem`單位，是能輕易的根據`<html>`的`font-size`計算出元素的盒模型大小 ***** **rpx**：小程序中的單位，在愛瘋6中 1px=2rpx，整個頁面有750rpx ***** **vw**：viewpoint width，視窗寬度，1vw等于視窗寬度的1%；100vw=相對于視窗寬度 ***** [參考文檔](https://github.com/amfe/article/issues/17)