CSS中的em單位是指相對于元素的字體大小來測量長度。也就是說,1em等于元素內字體的大小。因此,對于不同大小的元素,1em表示的大小也是不同的。
使用em單位的示例代碼: p { font-size: 16px; margin-left: 2em; } div { font-size: 20px; margin-left: 2em; }
在上述代碼中,p元素和div元素都設置了左邊緣的外邊距為2em。由于p元素的字體大小為16px,所以2em的寬度等于32px。而div元素的字體大小為20px,因此它的2em的寬度為40px。
使用em單位的好處在于,它可以保持文本的相對大小比例。例如,如果您將字體大小從16px增大到20px,并且您在樣式表中使用em,元素的外邊距也會相應地增加,使得文檔仍然具有相同的比例和布局。
需要注意的是,em單位也可以用于行高、內邊距和邊框寬度等屬性。在這些情況下,em并不是基于元素的字體大小計算,而是基于它的父元素字體大小或繼承的字體大小進行計算的。