(接上篇的字型大小部分)
font-size
的長度單位:<html>
)來決定字型大小。font-size: 20px
。font-size-adjust
屬性font-size-adjust
是處理字型縱橫比的屬性,縱橫比是字型的x-height除以font-size
後的結果,縱橫比低的字型會較快失去可讀性。font-size-adjust
是為了使用非網頁作者首選字體時,使網頁仍具可讀性,不同字體在相同尺寸時的可讀性會差異很大(可讀性低的字體會較難閱讀)。font-size-adjust: auto;
直接設定,因為字體檔字一般會預設縱橫比,轉換字體時可以以此為基準,另外,也可用font-size-adjust: none;
關閉所有對字型尺寸的調整。font-size-adjust: 0.58;
,不加任何單位。font-size-adjust
和font-size
的換算方式為:宣告的font-size
×(font-size-adjust
值÷原設定字體的縱橫比)=調整後的font-size
,其中font-size-adjust
值一般就是變更後字體的縱橫比。例如原設定字體Times縱橫比為0.46且font-size: 10px;
,變更後字體Verdana縱橫比為0.58,因此可以得知font-size-adjust: 0.58;
,變更後的font-size
經由計算可得10×(0.58÷0.46)=12.6,所以變更後font-size: 12.6px;
。font-size
的繼承行為,是繼承計算後的數值,而非百分比之類的單位。larger
和smaller
)、長度單位em、百分比會根據親代元素決定字型大小。font-size: 80%
,最後第四層的縮放比例會是40.96%,而非80%,所以如果要使用長度單位來設定字型大小時,rem會比em更好些,因為rem根據根元素決定大小,不會出現這種情況。<p>...<span>...</span>...</p>
,CSS為p{font-size: medium;} span{font-family: monospace; font-size: 2em;}
,如果依照預設,font-size: medium;
會回報font-size
為16px,根據繼承規則,<span>
應該是32px,但在有些瀏覽器會回報26px,這是因為在這些瀏覽器繼承到子代<span>
時是繼承關鍵字medium
,而根據使用者代理,等寬字的預設大小為13px,所以會造成這種結果。這種情況的處理方式,就是在<span>
的CSS中改寫成span{font-family: monospace, serif; font-size: 2em;}
,加上serif
,可以解決這個問題,因為這會讓所有瀏覽器將font-size: 2em
視為<p>
當中font-size
計算值得200%,而非medium
對應的數值,所以可以解決這個Bug。