相關(guān)鏈接
http://www.runoob.com/cssref/css-units.html
http://blog.csdn.net/h_o_l_y/article/details/51852202
em何意疯特？
它是描述相對(duì)于應(yīng)用在當(dāng)前元素的字體尺寸陨瘩，所以它也是相對(duì)長(zhǎng)度單位洒沦。一般瀏覽器字體大小默認(rèn)為16px芥丧，則2em == 32px泞当；
1em=元素中文本的1個(gè)垂直高度
如果元素中文本的大小為16px才沧，那么1em=16px;如果元素中文本大小為20px,那么1em==20px
PS:相對(duì)長(zhǎng)度成翩，相對(duì)于當(dāng)前應(yīng)用內(nèi)文本的字體尺寸。
字體單位使用em能支持IE6下的字體縮放叮雳，在頁(yè)面中按ctrl+滾輪想暗，字體以px為單位的網(wǎng)站沒有反應(yīng)。
任意瀏覽器的默認(rèn)字體高都是16px帘不。所有未經(jīng)調(diào)整的瀏覽器都符合: 1em=16px说莫。那么12px=0.75em,10px=0.625em。為了簡(jiǎn)化font-size的換算寞焙，需要在css中的body選擇器中聲明font-size=62.5%储狭，這就使em值變?yōu)?16px62.5%=10px, 這樣12px=1.2em, 10px=1em, 也就是說只需要將你的原來的px數(shù)值除以10，然后換上em作為單位就行了*捣郊。
em的特點(diǎn)
- em的值不固定
- em會(huì)繼續(xù)父級(jí)元素的字體大小
舉個(gè)例子
例一辽狈，
默認(rèn)情況下1em=16px，如何改變這個(gè)默認(rèn)值呢模她？
body {
font-size: 24px;//修改font-size就可以更改默認(rèn)值
width: 10em; /* 10em = 24px * 10 = 240px */
}
例二稻艰，
body {
font-size: 12px;
}
div {
/* 該元素沒有設(shè)置font-size，因此繼承了父元素的font-size: 12px; */
width: 10em; /* 10em = 12px * 10 = 120px */
}
例三侈净，
body {
font-size: 12px;
}
//子元素設(shè)置了font-size尊勿，但是單位不一樣怎么算呢？
div {
font-size: 2em; /* 2em = 12px * 2 = 24px */
width: 10em; /* 10em = 24px * 10 = 240px */
}
注意：
- 如果元素自身設(shè)置了font-size畜侦，那么參考文本大小就是自身的font-size大小
- 如果元素自身沒有設(shè)置font-size元扔，那么參考文本大小就是父元素的font-size大小
- 為元素設(shè)置font-size時(shí)，如果使用em作為單位旋膳，那么1em＝父元素的font-size大小
