CSS中的class值是一種非常重要的概念，它可以被用來為HTML元素指定樣式。

而在過去，CSS的class值的使用方式和現在稍有不同。過去，我們常常使用HTML的類屬性來定義元素的class值，例如：

<div class="box">這是一個盒子</div>
.box {
/* 樣式定義 */
}

上述代碼中，我們通過HTML代碼為元素指定了類名為"box"，在CSS中則使用了選擇器".box"來定義該類的樣式。這種方式的好處在于可以避免重復定義樣式。

不過，這種寫法存在一些問題。例如，HTML中的類名屬性是字符串類型，可能因為手誤或者不規范而導致無法正確匹配CSS中的選擇器。因此，在 HTML5 中，我們推薦使用"data-"前綴來自定義屬性，例如：

<div data-role="box">這是一個盒子</div>
[data-role="box"] {
/* 樣式定義 */
}

這樣就可以確保HTML中自定義屬性的可靠性和CSS與其的匹配。

另外需要注意的是，在CSS中，類選擇器是以"."（點號）開頭的，而自定義屬性選擇器是以"["（中括號）開頭的。這是兩種不同的語法規則，需要進行區分。

總的來說，使用class值來定義元素的樣式是一種非常基礎的技能，也是CSS表現層面重要的一部分。只要掌握好它的語法和使用方法，就可以為網頁帶來更加美觀的視覺效果。