篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了markdown em vs rem相关的知识,希望对你有一定的参考价值。
<font size=4>`em`</font>   <font color=silver>(which is relative to parents' font size)</font>:          
scaling elements which `font-size` is different from `<html>`'s
<br>
Commonly used on `margin`, `padding`, `width`, `height`, `line-height`
on <font color=lightblue>headings</font>, <font color=lightblue>menu</font> items, <font color=lightblue>buttons</font>
 (because if element's font changes, it might become too small/big to look good)
<br>
<font size=4>`rem`</font>   <font color=silver>(which is relative to root `<html>` element font size)</font>:    
for everything else
Use on ALL `font-size`s (preserve scalability but avoid `em`s inheritance confusion) with a few __exceptions__:
* Second level <font color=lightblue>menu item</font> in a dropdown menu where its `font-size` is different from parent's).
* Font icon used inside a button, where the icon’s size should relate to the button’s text size.
<br>
Conversion from `rem` to `em` based on `font-size` of parent element (rem):  
`converted-unit` <font size=1>em</font> = `unit-to-convert` <font size=1>rem</font> ÷ `parent-font` <font size=1>rem</font>    eg
`Xem` = `19rem` ÷ `1.6rem`