前端介面開發表示大小的單位有 px、rem、em。這三種有什麼區別呢？px指畫素值，固定大小，較好理解。rem、em的區別呢？em是針對body中的font-size的倍數，rem是針對html的倍數。
1、em
em是針對body中font-size的倍數，font-size預設是24px
例：body
則：1em=10px
2、rem
rem是針對html的倍數
html
body
h1 3、px
4、line-height帶單位和不帶單位的區別
line-height:30px;
line-height:120%;
line-height:1.2
1）line-height:120%;代表行高為 父級元素.font-size*120%
2)line-height:1.2; 代表行高為 子級元素。font-size*1.2
移動端字型大小、margin、padding大小調節
傳統做法：
將設計圖縮放到320px，然後設定字型為rem，margin、border為px。（原因：margin、borer、padding為rem單位，換成px和原始數值有插入
改進後做法：
設計圖 640px ，定義body的width是6.4rem；font-size通過devicewidth/6.4得到。
設計圖750px ，定義body的width是7.5rem；font-size通過devicewidth/7.5得到。
devicewidth可以通過document.documentelement.clientwidth可視寬度來獲取。那計算font-size的**如下：（7.5代表設計圖為750px)
document.documentelement.style.fontsize = document.documentelement.clientwidth / 7.5 + 'px';
取100px為乙個參照，之後的都是 長度/100rem
例：設計圖為750px
則 body中的width為 7.5rem
font-size=devicewidth/7.5=750/7.5=100 px=1rem
設計圖為640
取100px為乙個參照
則body中的width為6.4rem
font-size=1rem
上面**其實我和之前**是大體類似的。也是設定rem跟字型，以750寬度為基準，為100px,375寬度是50px。
前端開發中的單位
1.畫素 1 在前端開發中視口的水平方向和垂直方向都是由很多個小方格組成的，乙個小方格就是乙個畫素，例如div的尺寸是100 100，那麼水平方向就占用100個小方格，垂直方向也占用100個小方格 2 畫素的特點 畫素的大小不會隨著視口的變化而變化，畫素是乙個固定的單位 絕對單位 2.百分比 1 百...
前端頁面css字型單位大小畫素
乙個頁面字型的大小在不同的裝置上效果會不同，怎樣解決字型的大小適中成為乙個很值得考慮的問題。解決這個問題多種做法多種方案，根據自己的需求自行選擇合適你的 純css方案 px常用的字型大小的單位，px相信是大家經常用的 pt全稱 point 意思大致為 點，是乙個專用的印刷單位 磅 大小為1 72英吋...
前端開發中的長度單位詳解
在前端開發中，會遇到各種不同型別的長度單位，比如px,em,rem等。而整體的長度單位分為兩大類 相對長度和絕對長度。絕對長度單位是乙個固定的值，它反應乙個真實的物理尺寸。絕對長度單位視輸出介質而定，不依賴於環境 顯示器 解析度 作業系統等 相對長度都有乙個基準 其中，px,em和rem用的較多。需...