閱讀原文掃碼檢視：
自己研究摸索了幾種h5移動端字型自適應的方法，分享出來和大家一起共享。
方法一：純css方法, 精確度高，ios 和 安卓 字型大小同等比例
1.1 以16px為基準，在根元素html下，字型為62.5%
1.2 此時1rem=10px;
/* css** */
html
body
2. 在css裡，設定 html 元素的字型 font-size 設定為,50px;
2.1 字型和元素寬度用rem，字型和元素的實際大小等於：rem乘以100除以2
/* css** */
/* 在根元素html下，font-size 設定為,50px; */
html
body
/* 示例 設定乙個寬為400px 高為150px 字型大小為 24px 的div盒子 */
.div
/* 以上結果為：
* width:400px;
* height:150px;
* font-size:24px;
* /
3. 此方法rem轉px精確不是高
3.1 以iphone6為例，rem轉px 零誤差；以三星s5為例，rem轉px誤差0002
3.2 ios 上1rem=10px;安卓上，1rem=1.5px到1.4168px之間;因此使用了 ismobile 方法判斷裝置平
臺，使rem轉轉px,盡量在ios 和 安卓上 單位長度保持統一==
3.3 1rem=10px
// js js動態計算rem轉換p
function
fontsize()
if(mobiletype ==
"iphone")}
;if(!doc.addeventlistener)
return
; win.
addeventlistener
(resizeevt, recalc,
false);
recalc()
;})(document, window)
;//移動端 文字適配
}else
}// -識別ios還是安卓
// param test: 0:iphone 1:android
function
ismobile
(test)
else
}catch(e
)}}else
ifindexof
('ipad'
)>-1
indexof
('iphone'
)>-1
)else
};
移動端h5框架自適應 移動h5自適應布局
轉 問題一，解析度resolution適配 不同螢幕寬度，html元素寬高比和字型大小，元素之間的距離自適應，使用rem單位。問題二，單位英吋畫素數ppi適配 使用rem單位，文字會發虛。段落文字，使用px單位，用media query或js來適配。標題文字可以直接使用rem單位。問題三，裝置畫素比...
js自適應rem 主要適用於移動端
rem是指相對於根元素 html 的字型大小的單位,利用它能實現強大的螢幕適配布局。下面主要應用的是基於js去調整根元素字型大小，從而實現各個尺寸螢幕的適配 使用方法 1.複製上面這段 到你的頁面的頭部的script標籤的最前面。2.根據設計稿大小，調整裡面的最後兩個引數值。3.使用1rem 100...
移動端h5自適應rem適配
雖然在網上也找到很多關於這個rem的自適應，但是還是要找合適自己的專案的，我這次也是找了乙個不太合適的，後來找了這個，所以我給大家分享一下，一般設計稿都是750 750的直接可以複製過去可以用 不過還得注意你們設計給的設計稿的寬高，專案中用的話寬高直接 10px就行，輕鬆加愉快的用起來哈 直接上 哈...