em
首先要知道em是相對(duì)于誰(shuí)的值。
以前我一直以為em是使用em這個(gè)元素的父元素的font-size值钓辆。這句話是對(duì)也不對(duì)剪验。
為什么這么說(shuō)呢？
當(dāng)使用em的這個(gè)元素沒(méi)有設(shè)置顯式的設(shè)置font-size值的時(shí)候（這里的顯式是指使用px等單位設(shè)置前联，像font-size=1.25em這種不算功戚，下文會(huì)介紹這種情況。）似嗤，font-size=1.25em的em值是該元素的父元素的font-size值疫铜。比如其父元素的font-size=16px，那么該元素的font-size=1.25*16px=20px双谆。但是如果這個(gè)元素還設(shè)置了padding值壳咕，而且還好死不死的用了em。padding=2em顽馋，那么情況會(huì)怎么樣呢谓厘？好了不賣關(guān)子了就直接說(shuō)了，這里的padding值會(huì)等于40px寸谜，哎竟稳？這種情況的話em不是等于20px了嗎？哎熊痴？這個(gè)20px好像在哪里見(jiàn)過(guò)哎他爸。沒(méi)錯(cuò)就是上面設(shè)置的該元素的font-size值。這個(gè)時(shí)候就有點(diǎn)亂了果善。那什么時(shí)候em是指的父元素的font-size值诊笤，什么時(shí)候又是指的是元素本身的font-size呢。在元素本身沒(méi)有顯式設(shè)置font-size值的時(shí)候巾陕，也就是說(shuō)其font-size的值是由繼承得來(lái)的時(shí)候讨跟，em值為其父元素的font-size值（此時(shí)該元素的font-size繼承值就是父元素的font-size）。而且在任何時(shí)候鄙煤，該元素內(nèi)其他屬性使用em的時(shí)候晾匠，em的值都是該元素本身的font-size值（計(jì)算值）。
rem
rem是指根元素HTML的font-size值梯刚，在沒(méi)有設(shè)置根元素HTML的font-size時(shí)凉馆，html的font-size會(huì)繼承瀏覽器的默認(rèn)字體大小。
比如瀏覽器的默認(rèn)字體為16px，那么此時(shí)的html繼承了這一字體大小澜共，那么在HTML文檔的任何地方rem都是16px向叉，如果html設(shè)置了font-size=1.25em，此時(shí)html的font-size=1.25×16px（繼承瀏覽器）=20px咳胃，那么rem就等于20px植康。同時(shí)如果瀏覽器字體大小被改成20px旷太，那么html的font-size為1.25*20px=25px展懈，rem也就是25px了。當(dāng)然如果顯示的設(shè)置了HTML的font-size=10px供璧，那么rem也就是10px了存崖。
