在前端開發中，CSS 命名規范是一個非常重要的話題。隨著項目的復雜度不斷增加，良好的命名規范可以幫助我們更快地理解代碼，避免名稱沖突，提高代碼可讀性，方便維護。其中，em 的命名規范在實際開發中也有重要的作用。

em 是一個相對單位，通常用于設置字體大小、行高、寬度、高度等屬性。在 CSS 中，em 主要用于設定相對值，具有相對于當前元素的字體大小的特性。因此，在命名規范中，em 應該被用于表達相對大小的概念。

/**
 * 設計規范的字體大小為 14px，使用 em 作為單位名稱
 * 根據設計規范，每個子元素的字體大小為父元素的 0.86 倍
 */
.font-size-14 {
font-size: 14px;
}
.font-size-12 {
font-size: 0.86em; /* 相對于父元素的字體大小 */
}
.font-size-10 {
font-size: 0.72em; /* 相對于父元素的字體大小 */
}
/**
 * 表達高度的概念
 */
.item {
height: 5em;
}
.item-title {
height: 2em;
}
.item-content {
height: 3em;
}
/**
 * 表達寬度的概念
 */
.container {
width: 20em;
}
.container-left {
width: 8em;
}
.container-right {
width: 12em;
}

在命名規范中，em 可以幫助我們更好地維護代碼，增加代碼的可讀性。良好的命名規范是一個團隊協作的重要基礎，我們應該秉持規范化的原則，使團隊中的成員可以輕松閱讀代碼，配合開發工作。