核心結論

場景	大小寫敏感性	規範依據
CSS 選擇器中元素名（HTML 文檔）	**不敏感**	HTML 不區分大小寫
CSS 選擇器中元素名（XHTML/XML 文檔）	**敏感**	XML 區分大小寫，XHTML 強制小寫
Class 名稱	**敏感**	HTML/XHTML class 屬性區分大小寫
ID 名稱	**敏感**	HTML/XHTML id 屬性區分大小寫
CSS 屬性名/關鍵字值	**不敏感	CSS 規範定義不區分大小寫
字體族名稱	**敏感**	系統字體匹配區分大小寫
URL 路徑	**視伺服器文件系統**	Linux 區分，Windows 不區分

工程化統一規範：全域小寫

1. 所有自定義標識符全小寫：Class、ID、CSS 變量、Keyframes 名稱、@counter-style 名稱。
   .user-card、#main-content、--color-primary、@keyframes fade-in
2. CSS 關鍵字/屬性名全小寫：display: flex、background-color: red、@media screen。
3. 字體族名按系統實際大小寫：font-family: "PingFang SC", "Microsoft YaHei", sans-serif; 複製系統字體面板確切名稱。
4. URL 路徑全小寫：避免 Linux 部署 404，構建工具輸出哈希文件名亦全小寫。

歷史遺留與遷移

• 存量代碼含大寫 Class/ID：
  ① 全局搜尋替換（需同步 HTML/JS/模板）
  ② 或建立映射表，新代碼全小寫，舊代碼隔離模塊逐步重構
• 框架生成 Class（Vue scoped、CSS Modules）自動哈希，無大小寫問題。

自動化檢查

• Stylelint："selector-class-pattern": "^[a-z][a-z0-9]*(-[a-z0-9]+)*(__[a-z0-9]+(-[a-z0-9]+)*)?(--[a-z0-9]+(-[a-z0-9]+)*)?$" 強制小寫 BEM。
• HTMLHint："id-class-value": "dash" 強制 ID/Class 小寫連字符。
• CI 攔截：合併請求檢查大小寫違規，禁止合入。

總結

CSS 大小寫敏感性是**文檔類型（HTML/XHTML）與標識符類型（元素/屬性/自定義）交叉矩陣**。為消除認知負擔、跨平台風險、團隊分歧，**採用「全域小寫」統一規範**是工程化最優解。配合 Lint 工具鏈強制執行，將大小寫問題從開發認知中徹底移除。