單位種類：
px? ? em? ? %? ? rem? ? vh/vw? ? vmin/vmax
1左医、px
像素單位 pixel的縮寫
相對長度單位，瀏覽器的度量單位客给，相對于物理像素（顯示器屏幕分辨率）
2坤学、em
特點：相對父元素的font-size疯坤。
例如：
如果設置當前元素的font-size為0.75em，而其父元素的font-size是16px時深浮，則當前元素的font-size是0.75 * 16px = 12px;
如果設置當前元素的width是10em压怠，而當前元素的font-size是16px（無論是繼承自父容器還是設置的）時，則當前元素的width是10 * 16px = 160px;
注意1：任意瀏覽器的默認字體高都是16px飞苇，如果給body元素的font-size設置為62.5%菌瘫，那body的font-size實際大小是 16px*62.5%=10px，如果所有子元素都以該字體大小使用em作為尺寸單位布卡，相當于1em=10px雨让，這樣設置em就非常簡單，只要將實際px數(shù)值除以10忿等，就是em單位值栖忠。
注意2：em相對于px的值并不是固定的，是會隨著父元素或者當前元素的font-size不同而變化贸街。
3庵寞、%
特點：相對于父元素的長度高度。?
注意1：position:fixed時薛匪，無論當前元素放在哪里捐川，將相對于窗口寬度。
注意2：position:absolute時逸尖，將相對于其相對的元素寬度（遞歸父元素直到第一個設置了position的元素）属拾。
4、rem
特點：相對于根節(jié)點(一般為html節(jié)點)的font-size冷溶。
例如：
如果html節(jié)點設置font-size = 100px渐白，那么文檔中的元素設置為0.3rem，則計算為：0.3 * 100px = 30px逞频。
這個單位與em有什么區(qū)別呢纯衍？區(qū)別在于使用rem為元素設定字體大小時，仍然是相對大小苗胀，但相對的只是HTML根元素襟诸。這個單位可謂集相對大小和絕對大小的優(yōu)點于一身，通過它既可以做到只修改根元素就成比例地調整所有字體大小基协，又可以避免字體大小逐層復合的連鎖反應歌亲。
5、vh/vw
特點：相對于視窗（Viewport）的高度和寬度澜驮。
例如：
1vh 等于1/100的視窗高度陷揪，1vw 等于1/100的視窗寬度。
視窗:是指瀏覽器內部的可視區(qū)域大小，即window.innerWidth/window.innerHeight大小悍缠，不包含任務欄標題欄以及底部工具欄的瀏覽器區(qū)域大小
6卦绣、vmin/vmax
特點：vmin：取視窗高度和寬度的最小值作為基準。vmax：取視窗高度和寬度的最大值作為基準飞蚓。
例如：
瀏覽器視窗大小為 window.innerWidth=1000px滤港，window.innerHeight=800px，那么趴拧，1vmin=800px/100=8px; 1vmax=1000px/100=10px溅漾。
使用場景：做移動頁面開發(fā)時，如果使用 vw著榴、wh 設置字體大刑砺摹（比如 5vw），在豎屏和橫屏狀態(tài)下顯示的字體大小是不一樣的兄渺。由于 vmin 和 vmax 是當前較小的 vw 和 vh 和當前較大的 vw 和 vh缝龄。這里就可以用到 vmin 和 vmax汰现。使得文字大小在橫豎屏下保持一致挂谍。
