首先rem是根據--根節點的字體大小控制rem的大小。
先按照設計圖的尺寸用px單位把整個頁面寫出來.....然後網上找px轉換rem的工具，也可以自己算。。最後就是設置html的font-size了..這個要用px來做單位...這樣就可以控制單位為rem的大小了。。（控制html的字體大小可以用@media根據不同的屏幕來設置，，也可以用js獲取屏幕寬度或高度來計算。。然後設定字體大小）...2017-08-17 9.54
Ⅱ Js動態設置rem來實現移動端字體的自適應代碼
下面一段代碼給大家介紹了Js動態設置rem來實現移動端字體的自適應，以此做個記錄，方便以後需要，感興趣的朋友一起看看吧。
具體代碼如下所示：
//設置根元素字體
var
win
=
window,
doc
=
document;
function
setFontSize()
{
var
winWidth
=
$(window).width();
//750這個數字是根據你的設計圖的實際大小來的，所以值具體根據設計圖的大小
var
size
=
(winWidth
/
750)
*
100;
doc.documentElement.style.fontSize
=
(size
<
100
?
size
:
100)
+
'px';
};
//這里我們給個定時器來實現頁面載入完畢再進行字體設置
setTimeout(function()
{
//初始化
setFontSize();
},
100);
以上所述是小編給大家介紹的Js動態設置rem來實現移動端字體的自適應代碼，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！
Ⅲ rem布局中需要引入什麼js嗎
不需要，rem只是css3的一個新的長度單位，與js無關，所以不需要引入任何js。如下面的例子就是rem的使用方法的簡單例子：
<style>
html,h1{font-size:12px;}
p{font-size:2rem;}
</style>
<h1>下面的文字將是html定義的字體大小的2倍：</h1>
<p>我是html定義的12px的2倍，字體大小為24px</p>
Ⅳ rem的作用與運用，小程序為什麼用rpx為單位
開發過小程序的人都知道，小程序的單位是rpx，這是為什麼？有什麼作用呢，其實它源於rem布局，先來了解下rem的優勢與工作原理。
rem布局在沒正式使用到項目中，只知道他是根據html根元素的font-size來變化的;
若：html{ font-size:20px};
則1rem = 20px;
然後呢，有什麼作用，定完html的font-size後，元素使用rem和使用px有什麼區別，不都一樣么？
其實rem他的主要運用場所在移動端，移動端的設計稿一般都是iphone6為基礎設計的，設計稿的寬為750px；
手機的物理尺寸是375px；所以在用css的時候，設計尺寸需要除以2；
要用rem完成移動端的適配，答頃需要固定瀏覽器的顯示寬度不變。
也就是說，我在設計稿上量到寬367px的大小，那麼css里可以旁舉寬直接寫width:3.67rem。
此時，（以375px寬手機為例）第二步js設置的html字體大小為：375px除以7.5得50px；
7.5rem乘以50px得到的是375px剛好是屏幕的滿寬。
也就是說，不論手機屏幕寬度多少，7.5rem永遠能占屏幕的滿寬。這樣，在寬屏手機里，元素能夠等比例放大一些，實現各類機型的適配，也方便了前端編碼。
而做過小程序的人都知道，小程序不論任何機型，屏幕滿寬都是750rpx，其實也就是從7.5rem延伸而來，至於根目錄字體大小的配置，微信開發者工具已經將這些都配置好了，你盡情用就可以了。
如果有幫助，請點運亮贊支持哦。
Ⅳ Rem及其使用
（font size of the root element）是指相對於根元素的字體大小的單位
目前，IE9+，Firefox、Chrome、Safari、Opera 的主流版本都支持了rem。即使瀏覽器不支持rem，就多寫一個絕對單位的聲明即可，瀏覽器會忽略用rem設定的字體大小。
（1）首先瀏覽器的默認字體大小是16px
（2）100%=16px => 6.25%=1px => 62.5%=10px，因為rem是相對於根元素，因此在css的html中全局聲明font-size=62.5%，此時的1rem就睜閉等於10px，這樣一來rem和px之間的換算就比較簡單，使用起來更方便
（3）使用JS根據瀏覽器寬度（或瀏覽器可視區域寬度（clienWidth））動態設置html的大小
通過JS動態設置根元素的font-size，這樣的好處是悉豎裂所有設備解析度都能兼容適配，淘寶首頁目前就是用的JS計算。如果不用JS也是可以做適配的，一纖空般我們在做web app都會先統計自己網站有哪些主流的屏幕設備，然後去針對這些設備去做media query設置也可以實現適配，如：
（4）使用媒體查詢設置根元素大小——rem和px在響應式中的應用對比，如：
（5）Rem自適應JS，現在也有封裝好的JS供我們直接使用
（6）屏幕適配還有一種簡單粗暴的做法，即設置viewport進行縮放
天貓web app的首頁就採用過這種方式，以320寬度為基準，進行縮放，最大縮放為320*1.3 = 416，基本縮放到416都就可以兼容iphone6 plus的屏幕了，這個方法簡單粗暴，又高效。