閱讀過幾篇關於px rem的文章，感覺rem很強大。但是自己接觸到的公司專案全部都使用px，想知道為什麼。是我司技術更新落後了嗎？
--- 補充：我們當然有在用vw和vh，但是隻是在layout層級。元件層使用px。
回覆列表
-
1 # 三歲程式設計
-
2 # 前端王富貴
早些年移動端剛開始盛行的時候，為了移動端網頁能夠適配不同尺寸的手機螢幕，淘寶某前端大佬寫了一段適配的js，叫做flexible，可在github搜尋到。原理很簡單，好像就是根據手機解析度和dpi(具體不記得了)，動態設定根源素html的fontsize，然後頁面元素大小都以rem來做單位。因為1rem=html的fontsize。
後來有了vw和vh，慢慢的很多專案都用vw來做適配了，100vw=100%的寬度。因為相容性不是很好，所以一直沒有就行起來。
nodejs出現以後，前端工程化開始了。出現了pxtorem，pxtoviewport等外掛，我們可以在開發的時候按照ui標註的px大小直接寫，在打包的時候，外掛會幫助我們把px計算轉化為rem或者vw。
我現在都用vw。不考慮相容性。有需要相容ie的公司，我看都不看一眼。[捂臉]
rem是相對根元素html標籤的字型大小，然而html標籤字型也要用一個基準大小，而這個大小就是px畫素。
有很多人誤認為px畫素是一個絕對尺寸單位，實際px是相對單位，與螢幕解析度有關，會跟隨放大縮小。
有幾種主要佈局方式，例如三列布局，左中右，左右都可以用畫素，中間分配剩餘寬度。
例如移動端框架framework7等一系列專用框架
另一種就是幾列都用百分比，例如bootstrap。
使用rem作為寬度的很少。如果要做到根據視口大小放大，px更容易。
比如做一個750畫素寬的頁面，不同手機，根據視口放大縮小，rem計算量太大。px需要寫適配的js，rem也要寫適配js，反正都需要寫輔助js，都是基於px，那還不如省事直接用px。
多數設定並不需要頁面根據視口放大縮小。