在前端開發中，樣式表起到了至關重要的作用。然而，當頁面規模越來越大時，樣式表中的class命名也會越來越多，這不僅增加了開發者的工作量，也嚴重影響了代碼的可維護性和可讀性。因此，自動改變css的命名逐漸成為了一個熱門話題。

// 原始class
.header {
background-color: #333;
color: #fff;
height: 60px;
}
// 自動改變css的命名
.gcn-4690 {
background-color: #333;
color: #fff;
height: 60px;
}

自動改變css的命名概念非常簡單: 使用一個工具或插件，通過對CSS中的選擇器進行分析和處理，自動生成一個唯一的、沒有實際含義的class名，替代人為手動取名的方式。這樣做的優點在于，將class名生成的過程交給機器，可以讓樣式表更加規范，易于維護，也不會出現人為取名不規范、沖突等問題。

常見的自動改變css命名的插件有cssnano和PurifyCSS，它們使用類似的算法，通過分析HTML文件和CSS文件中的代碼，去除未使用的class，同時將重復出現的class名自動合并，從而減少樣式表的大小和復雜度。除此之外，還有會從一些定義的單詞和縮寫中，隨機選取字符組合進行命名的插件。

// 例子
.hc, .tx-yl, .ft-wxy { /*...*/ }

需要注意的是，自動改變css的命名在實際使用時也有一定限制。特別是在眾多使用了動態class的框架中（如React），自動改變css命名可能會在組件樣式無法生效的情況。因此，在使用自動改變css命名的同時，還需針對具體的項目進行調整和優化。