標(biāo)簽（空格分隔）： em rem
簡(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作為單位。
會(huì)方便启具、快捷本讥、容易的實(shí)現(xiàn)響應(yīng)式效果。
em詳細(xì)說(shuō)明
em參照父級(jí)元素大小
如果父級(jí)元素font-size:20px;鲁冯，給子元素設(shè)置字體font-size:1em;拷沸，子元素其實(shí)就是20px大小。
示例：
- 設(shè)置1em=20px
- 設(shè)置2em=40px
- 設(shè)置2.5em=50px
- 設(shè)置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)簽
所以只需要更改html標(biāo)簽字體的大小，就可以影響全部使用rem單位的標(biāo)簽
代碼示例
html{
font-size: 100px;
}
.title{
width: 5rem;/*500px*/
height: 5rem;/*500px*/
font-size: .3em;/*30px*/
}
在做響應(yīng)式網(wǎng)頁(yè)時(shí)衡创，可以根據(jù)媒體查詢?nèi)フ{(diào)節(jié)
html標(biāo)簽的字體大小帝嗡，實(shí)現(xiàn)共同調(diào)節(jié)其他標(biāo)簽大小的效果。
使用媒體查詢調(diào)節(jié)html字體大小璃氢，效果不夠精細(xì)（大小是分段改變的）哟玷，可以使用JavaScript動(dòng)態(tài)計(jì)算html的font-size.
使用注意點(diǎn)
在rem使用過(guò)程中，要時(shí)刻注意字體最小12px的問(wèn)題
設(shè)置html的font-size屬性時(shí)候一也，最好不要小于12px巢寡。
如果設(shè)置了
10px，使用1rem時(shí)椰苟，其實(shí)是12px抑月，因?yàn)樽钚≈凳?code>12px。
