時隔半年，再次回顧移動端開發，感覺自己又張知識了~~~~~~
我們平常用的較多的單位是px,百分比，rem,em,vw,vh，但是在移動端用的比較多的還是rem，但是他在用的過程中要注意什麼呢，怎麼用呢，下面就開始啦。。。。。。
他是乙個度量單位，可以用他作為高寬，字型的單位。他以html中設定font-size的大小為基準，比如我們設定根元素html的font-size為12px,那麼1rem = 12px。我們知道移動端中，不同手機，螢幕寬度是不一樣的，所以在不同螢幕上，我們必須讓字型，長寬都能自適應，那麼我們得動態改變html的font-size的值去影響1rem的換算，那麼我們**中相應的長寬就會自動改變了。下面我們介紹幾種方法。
我們設定不用螢幕大小和解析度下，設定不同的字型大小
@media only screen and (max-width: 320px)
}@media screen and (min-width:321px) and (max-width: 375px)
}@media screen and (min-width:376px) and (max-width: 414px)
}@media only screen and (min-width: 415px)
}
1.首先在我們js檔案裡面，獲取我們當前手機螢幕的寬度，然後設定我們的html的字型大小為螢幕寬度/10後的取值
//獲取螢幕寬度
let htmlwidth = document.documentelement.clientwidth || document.body.clientwidth;
//獲取dom html
let htmldom = document.getelementsbytagname('html')[0]
//設定html的fontsize
htmldom.style.fontsize = htmlwidth / 10 + 'px';
@function pxtorem($px)
.box
}
.box
.box.item
rem移動端布局
1 rem是css3新增的相對長度單位，是指相對於根元素html的font size計算值的大小。簡單可理解為螢幕寬度的百分比。2 什麼是dpr?dpr是螢幕畫素密碼比 計算 dpr 液晶螢幕px尺寸 物理尺寸 量多少就是多少 常用的dpr有 dpr 2，dpr 3 window.devicepix...
移動端rem布局
什麼是rem rem是css3新增的乙個相對單位 root em，根em 這個單位與em有什麼區別呢？區別在於使用rem為元素設定字型大小時，仍然是相對大小，但相對的只是html根元素。em 作為font size的單位時，其代表父元素的字型大小，em作為其他屬性單位時，代表自身字型大小 mdn r...
移動端布局 REM
css單位有3種 px 絕對單位 em 相對父元素的單位 rem 相對根元素 頁面的html 的單位 css3新增的 什麼是rem？rem就是指相對根元素 頁面html 的單位。例如 html設定了font size為10px，那麼1rem就是10px，2rem就是20px html h1移動端布局...