使用Ems更改字體大小
在構建網頁時，大多數專業人員建議您使用諸如ems，exs，百分比或像素等相對度量來設置字體大小（實際上是所有內容）。 這是因為你真的不知道某人可能會查看你的內容的所有不同方式。 如果您使用絕對度量（英寸，厘米，毫米，點或皮卡），則可能會影響不同設備中頁面的顯示或可讀性。
W3C建議您使用ems作為尺寸。
但是有多大？
根據W3C的標準：
“等於它所使用的元素的'font-size'屬性的計算值，當'font-size'屬性本身的值出現'em'時就是例外，在這種情況下，它引用到父元素的字號。“
換句話說，ems沒有絕對大小。 他們根據他們的位置來確定他們的規模。 對於大多數Web設計人員來說 ，這意味著他們在Web瀏覽器中，所以1em高的字體與該瀏覽器的默認字體大小完全相同。
但是默認大小有多高？ 由於客戶可以在其瀏覽器中更改其默認字體大小，因此無法100％確定，但由於大多數人不這麼做，因此您可以認為大多數瀏覽器的默認字體大小均為16px。 所以大部分時間1em = 16px 。
用像素思考，用Ems來衡量
一旦您知道默認字體大小為16px，您就可以使用ems讓您的客戶輕鬆調整頁面大小，但以像素為單位考慮字體大小。
假設你有一個這樣的大小結構：
- 標題1 - 20px
- 標題2 - 18px
- 標題3 - 16px
- 正文 - 14px
- 子文本 - 12px
- 腳註 - 10px
您可以使用像素來進行測量，然後使用IE 6和7的任何人都無法很好地調整頁面大小。 所以你應該把尺寸轉換成ems，這只是一些數學問題：
- 標題1 - 1.25em（16 x 1.25 = 20）
- 標題2 - 1.125em（16×1.125 = 18）
- 標題3 - 1em（1em = 16px）
- 正文 - 0.875em（16 x 0.875 = 14）
- 子文本 - 0.75em（16 x 0.75 = 12）
- 腳註 - 0.625em（16 x 0.625 = 10）
不要忘記繼承！
但是，這並不是所有的ems。 你需要記住的另一件事是他們承擔父母的大小。 所以如果你有不同字體大小的嵌套元素，你可能會得到比你期望的更小或更大的字體。
例如，你可能有這樣的樣式表：
p {font-size：0.875em; }
.footnote {font-size：0.625em; }
這將導致主文本和腳註分別為14px和10px的字體。 但是，如果您在段落中添加腳註，則最終可能會顯示8.75px而非10px的文字。 試試吧，把上面的CSS和下面的HTML放到一個文檔中：
該字體的高度為14px或0.875 ems。
本段有一個腳註。
雖然這只是一個腳註段落。
腳註文本很難在10px處閱讀，在8.75px處幾乎難以辨認。
因此，當您使用ems時，您需要非常了解父對象的大小，否則最終會在頁面上出現一些非常奇怪的大小元素。