font-size屬性不被直接繼承：只有計算值(em或百分比時)被繼承幼驶，而不是整個聲明被繼承般甲。
特點：
- 僅被傳遞到子元素
- 單位em或百分比時被繼承
字體大小計算時有很奇怪的邊緣效果胚鸯。例如：我們對一個<div>元素使用80%的相對字體大小，其他嵌套在<div>元素中的元素同時也會繼承該大小這意味著其他元素的字體大小將是80%乘以80%窿克，即64%搓萧。
示例：
- 代碼：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.divRoot {
font-size: 40px;
}
.divChild {
font-size: 50%;
}
.divGrandson {
font-size: 50%;
}
.div20px {
font-size: 20px;
}
.div05em {
font-size: 0.5em;;
}
</style>
</head>
<body>
<div class="divRoot">
divRoot 40px
<div class="divChild">
divChild : 40px*50% = 20px
<div class="divGrandson">divGrandson : 40px * 50% * %50% = 10px</div>
<div class="div05em">div05em: 0.5em = 40px * 50% * 0.5 = 10px</div>
<div class="div20px">div20px : 20px</div>
</div>
<p>divRoot</p>
</div>
</body>
</html>
-
示例結(jié)果：
解決方案：
- 只在一個級別上使用相對字體大小奋单；
- 使用px作為單位來指定該元素的特定實例锉试，即不使用全局的元素選擇器，而是使用元素選擇器和ID選擇器的組合;
- 使用rem替代em作為字體單位览濒；
