我曾經在不同貼文上看見CSS區分大小寫，或CSS不區分大小寫的說法，也自己試試看過，有時可以，有時不可以，所以到底是怎樣呢？讓規範幫我們解謎吧！

語法Syntax

大致上來看看CSS怎樣寫：

規範名詞解釋
Property
Properties are attached to various parts of the document and to the page on which the document is to be displayed by the mechanisms of specificity, cascading, and inheritance

參考資料：W3C 3.1 Definitions
閱讀更多：MDN Anatomy of a CSS ruleset、W3C 4.1 Syntax

供應商(vendor)與前綴詞（vendor prefix）

供應商(vendor)是什麼？

• 通常指的是瀏覽器或其他軟體廠商，他們可以引入自己的特定樣式或屬性以擴展CSS功能。這些供應商特定的擴充功能通常以供應商前綴（vendor prefix）的形式出現，用於標識這些屬性或樣式是特定於某個供應商的。

-在 CSS 中，識別碼可能以「 」（破折號）或「_」（底線）開頭。以' 或 ' ' 開頭的關鍵字和屬性名稱保留用於供應商特定的擴充。此類特定於供應商的擴展應具有以下格式之一： - _

'-' + 供應商識別碼 + '-' + 有意義的名稱

參考資料:W3C 4.1.2.2 Informative Historical Notes

CSS區分大小寫嗎？

看看規範說了什麼

規範並沒有章節完整談這件事，所以以case-sensitive為關鍵字搜索！

W3C 4.1.3 Characters and case

• All CSS syntax is case-insensitive within the ASCII range (i.e., [a-z] and [A-Z] are equivalent), except for parts that are not under the control of CSS.
• For example, thecase-sensitivity of values of the HTML attributes "id" and "class", of font names, and of URIs lies outside the scope of this specification.
• Note in particular that element names are case-insensitive in HTML, but case-sensitive in XML.

W3C 5.1 Pattern matching

• The case-sensitivity of document language element names in selectors depends on the document language.
• For example, in HTML, element names are case-insensitive, but in XML they are case-sensitive.

W3C Selectors Level 3 - Case sensitivity

• All Selectors syntax is case-insensitive within the ASCII range (i.e. [a-z] and [A-Z] are equivalent), except for parts that are not under the control of Selectors.
• The case sensitivity of document language element names, attribute names, and attribute values in selectors depends on the document language.
  For example, in HTML, element names are case-insensitive, but in XML, they are case-sensitive.
• Case sensitivity of namespace prefixes is defined in [CSS3NAMESPACE].

從規範得知

• 基本上，CSS是不區分大小寫的。
• 選擇器(Selectors syntax)是不區分大小寫。
• 但是寫在HTML上的"id" and "class"則是區分大小寫的。(values of the HTML attributes)
• 元素名稱element names(Ex:<div>)在 HTML 中不區分大小寫，但在 XML 中區分大小寫。

• case-insensitive 不區分大小寫
• case-sensitive 區分大小寫
• element names 為 HTML name Attribute
• XML主要是用來儲存和傳輸資料的一種『結構化資料格式』，而且此格式既不限定硬體平台，也不與任何軟體系統綁在一起，適合做為異質系統之間溝通的資料格式。

小結

在Stackoverflow對此議題也有很多討論Ex: Are class names in CSS selectors case sensitive?不管如何，我覺得一律區分大小寫比較保險ＸＤ