##簡(jiǎn)單介紹
###單位
在編寫(xiě)網(wǎng)頁(yè)過(guò)程中挠唆，需要對(duì)元素（標(biāo)簽）進(jìn)行寬高处窥、顏色、字體等的設(shè)置玄组，這些需要使用單位滔驾。
在css中，設(shè)置字體和寬高使用的單位可以一致俄讹，例如：`px`/`em`/`rem`/...
###rem來(lái)源
>rem是CSS3中的單位
###和px的關(guān)系
`px`是使用最多的單位哆致。
em和rem可以合px單位進(jìn)行換算，就如`克和千克`之間可以換算一樣
具體換算規(guī)則患膛，在下面詳細(xì)說(shuō)明沽瞭。
###建議
>在做移動(dòng)端項(xiàng)目時(shí)，建議使用`rem`作為單位
>可以方便、快捷驹溃、容易的實(shí)現(xiàn)響應(yīng)式效果
##em詳細(xì)說(shuō)明
>em參照父級(jí)元素大小
如果父元素`font-size:20px;`,給子元素設(shè)置字體`fint-size:1em`,子元素其實(shí)就是`20px`的大小
**示例**：
*?設(shè)定?1em?=20px
*?2em?=40xp
*?2.5em?=50px
*?0.5em?10px
>`em`合適的使用場(chǎng)景是：text-indent(首航縮進(jìn))/line-height（行高）
##rem詳細(xì)說(shuō)明
>rem參考的是html標(biāo)簽字體大小
rem和em不同點(diǎn)就是em參考各自父元素城丧，如果父元素沒(méi)有設(shè)置字體大小，則繼續(xù)向上查找（父父元素）豌鹤，直至最后亡哄；
rem直接參照html標(biāo)簽字體大小，并且是所有使用rem單位的都是參照html標(biāo)簽
```?CSS
html{
foont-size:100px
}
.title{
width:5rem;/*500px*/
height:5rem;/*500px*/
font-size:.3rem;/*30px*/
}
```
>在做響應(yīng)式網(wǎng)址時(shí)布疙，可以根據(jù)媒體查詢?nèi)フ{(diào)節(jié)`html`標(biāo)簽的字體大小蚊惯，實(shí)現(xiàn)共同調(diào)節(jié)其他標(biāo)簽大小的效果
>使用媒體查詢調(diào)節(jié)`html`字體大小，效果不夠精細(xì)（大小是分段改變的）灵临，可以使用JavaScrupt動(dòng)態(tài)就算`html的font-size`
`document.documentElement.style.fontSize?=?innerWidth/10+"px";
window.onresize?=function(){
document.documentElement.style.fontSize?=?innerWidth?/10+"px";
}`
>(function(window){
var?winW?=?document.documentElement.clientWidth?||?document.body.clientWidth;
document.documentElement.style.fontSize?=?winW?/?10?+?"px";
window.onresize?=?function(){
var?winW?=?document.documentElement.clientWidth?||?document.body.clientWidth;
document.documentElement.style.fontSize?=?winW?/?10?+?"px";
}
})(window)
##使用注意點(diǎn)
在rem使用過(guò)程中截型，要時(shí)刻注意`字體最小12px`的問(wèn)題
設(shè)置html的font-size屬性時(shí)候，`最好不要小于12px`
如果設(shè)置了`10px`儒溉，使用`1rem`的時(shí)候宦焦，`其實(shí)就是12px，因?yàn)樽钚?px`
#縮放：?transform:scale(0.5)
---
