CSS3中的em是一種相對單位,用來表示某個元素字體大小的倍數。在CSS的長度單位中,em是相對于父元素的字體大小來計算元素的長度。這意味著,如果父元素的字體大小為16px,那么一個子元素設置為1em,就等同于16px。因此,當你改變父元素的字體大小時,子元素的大小也會隨之改變。
以以下的HTML和CSS片段為例:
<div class="parent"> <p class="child">Hello world!</p> </div> .parent { font-size: 16px; } .child { font-size: 1.5em; }
在這個示例中,父元素(.parent)的字體大小被設置為16px。子元素(.child)的字體大小被設置為1.5em,相當于16 * 1.5 = 24px。在這個基礎上,如果你改變父元素的字體大小到20px,子元素的字體大小也會隨之改變到30px。
em單位可以在幾乎所有CSS屬性中使用,例如邊距(margin)和寬度(width)。但是要特別注意末尾的"m"不可缺少。
總結一下,CSS3中的em是一個相對單位,它依賴于父元素的字體大小。使用em可以讓你的頁面響應式,當你改變父元素的字體大小時,頁面元素的大小也會隨之響應變化,這是一個非常強大的特性。