CSS的單位除了固定寬度的px，還有一種基于父元素字體大小的單位——em。具體來說，1em等于該元素對應的字體大小。因為em是基于父元素字體大小計算的，所以可以實現(xiàn)響應式字體大小的效果。

張鑫旭就曾在他的博客中深入地講解了em單位的使用方法和細節(jié)。他指出，em單位還有一些比較奇特的應用場景。

/* 比如設置垂直居中 */ 
.parent { 
height: 10em; 
} 
.child { 
height: 1em; 
margin-top: 4.5em; 
}

上面代碼的意思是：讓子元素高度為父元素字體大小的1倍，在父元素中垂直居中。 因為父元素高度為10em，子元素的margin-top為4.5em，兩者之和正好為父元素高度的一半。

另外，em單位也可以用于實現(xiàn)自適應布局，在移動設備上展現(xiàn)更好的效果。

/* 比如設置欄目寬度自適應 */ 
.list { 
width: 100%; 
font-size: 1.4em; 
} 
.item { 
width: 50%; 
float: left; 
padding: 0.5em 1em; 
}

上面這段代碼的意思是：列表寬度自適應屏幕寬度，每個子元素寬度為50%。這樣，在不同屏幕尺寸下，列表和子元素寬度會根據(jù)字體大小自適應。

張鑫旭的講解深入淺出，富于實例，是學習CSS em單位的不二選擇。