一扁眯、vw px rem em是什么
1.vw:就是相對視口寬度(Viewport Width)壮莹。1vw = 1% * 視口寬度。也就是說姻檀，一個視口就是100vw命满。
2.px:px應(yīng)該是在css中使用最為普遍的單位了吧。px是屏幕設(shè)備物理上能顯示出的最小的一點(diǎn)绣版。這個點(diǎn)不是固定寬度的胶台，是相對長度單位。在桌面瀏覽器中杂抽，1個像素往往是對著電腦屏幕的1個物理像素诈唬，但是在移動端，隨著Retina屏的流行缩麸，分辨率提高了铸磅。css中的1px并不等于設(shè)備的1px。比如蘋果三手機(jī)，分辨率是320 x 480阅仔。蘋果四手機(jī)吹散，變成了640 x 960，但是蘋果四手機(jī)的實(shí)際屏幕尺寸并沒有變化八酒。這時候的1個css像素就是等于兩個物理像素空民。
3.rem:是相對單位，相對于html的字體尺寸丘跌。
4.em:所有現(xiàn)代瀏覽器下袭景，默認(rèn)字體尺寸都是16px。這時,1em = 16px闭树。em會繼承父級尺寸耸棒，也是相對單位。
二报辱、vw px rem之間的換算
1.我們假設(shè)pad的設(shè)計(jì)稿是以1920px為標(biāo)準(zhǔn)的与殃。那么：
100vw = 1920px
1vw = 19.2px
我們想要： 1rem = 100px（這樣方便我們在寫代碼的時候換算）
那么:
100px = 100vw / 19.2 = 1rem
所以：
1rem = 5.208vw。
這時候碍现，我們只要給html的根元素設(shè)置：
font-size: 5.208vw即可幅疼。
2.同理的，手機(jī)端我們假設(shè)設(shè)計(jì)稿是以750px為標(biāo)準(zhǔn)的昼接，那么:
100vw = 750px
1vw = 7.5px
我們想要： 1rem = 100px
那么：
100px = 100vw / 7.5 = 1rem
那么：
1rem = 13.33vw
