“--”是有效的 CSS3 標識符嗎？

Question

根據 CSS 3 級規范，為了解析標識符的開頭，您：

檢查三個代碼點是否會開始一個標識符

看第一個代碼點：

• 如果第一個字符是- ，那么我們有一個有效的標識符，如果：
  1. 第二個代碼點是標識符起始代碼點（ [a-zA-Z_]或非 ASCII）。
  2. 第二個代碼點是- 。
  3. 第二個和第三個字符形成一個有效的轉義。

否則，我們沒有有效的標識符開始。 在確定我們是否有一個有效的標識符開始之后，擁有一個有效的<ident-token>的唯一要求是我們有 0 個或多個以下任意組合：

1. 轉義符
2. ASCII 字母
3. 數字
4. _或-
5. 非 ASCII 字符

由於我們不需要標識符開始標記后面的任何字符，這表明--是一個有效的標識符，即使任何瀏覽器或框架都不支持。 然而，即使是官方的 CSS 驗證服務（由設計 CSS 規范的人員維護）也不認為這是一個有效的標識符。 這僅僅是驗證服務中的一個錯誤嗎？

Answer 1

是的，它是有效的並且有效。 這是您可以定義的最短的自定義屬性（又名 CSS 變量）：

 body { --:red; background:var(--); }

相關： css 變量名可以以數字開頭嗎？

Answer 2

--自定義屬性標識符保留供將來使用，但當前瀏覽器錯誤地將其視為有效的自定義屬性。

也可以看看

• w3c/csswg-drafts#6313