一般來說，我們會使用 px 來作為網頁設計的單位，除了它精確度較高以外，對於許多網頁設計師來說也是相當容易入門的單位。
px 的特性是屬於 絕對數值，他不受外圍的單位影響，只要固定是 12px，就會以 12 像素呈現。以下方的範例來說，他並不會受到外圍文字大小所影響，內部的文字大小還是依據 CSS 設定所呈現。
另一個常見的文字單位是 em， em 是相對的的數值單位，它會受到外圍的文字大小所影響，而 1em 即是 1 的文字大小， 1.5em 也就是 1.5 倍的文字大小。
以下方的範例可以發現，如果外圍是以 15px，內層的文字第一層 1em 等同於 15px，隨後的依比例放大。
接下來改成使用 em 來做實驗，外層的文字大小直接從 1.4em 開始，可以看到內層的 1em 文字大小等同於外層 1.4em，隨後的逐漸放大。如果在加入一層在內部，文字就會以 1.4 * 1.4 的倍數再放大，這是 em 的相對比例單位的特性，是優點也是缺點，如果無法掌握就容易失控。
rem 也是相對的文字尺寸，和 em 使用方法接近，不同的是他僅相對於 root 層級的文字大小(網頁中的 html)。
此網站的文字大小是 16px，rem的尺寸就是以 16px 為基準，故下方的 1rem 會與 16px 相同尺寸。所以無論外層是否有其他文字大小，皆不會影響 rem 的尺寸，唯一會影響 rem 比例的只有 html 的文字大小
像是有些網站會有動態調整字體大小 (小 原本 大) 的樣式。這種情況就可以用 em 來代替。
而現在 bootstrap 的樣板，很多都是用 rem 作為單位。所以只要調整 html 的字體大小就可以達到調整所有字體大小的效果。
Reference