CSS类名中的反斜杠是什么[重复]答案

【问题标题】：What is the backslash in a CSS classname [duplicate]CSS类名中的反斜杠是什么[重复]
【发布时间】：2016-02-01 12:41:28
【问题描述】：

我正在为具有一些非常复杂的 CSS 的网站使用模板。

.container.\31 25\25 {
    width: 100%;
    max-width: 1200px;
    min-width: 960px;
}

容器类后面的“.\31 25\25”是什么？还有许多其他版本的容器类包含不同的数字。

【问题讨论】：

@Ferrrmolina：我什至不知道该说什么。好在 CSS 是相同的（我认为这就是您如何找到该问题的）。

标签： html css

【解决方案1】：

容器类后面的.\31 25\25是什么？

它引用名为 125% 的类，在 HTML 中将被引用为

<div class="125%">

下面是它的分解方式：

.\31 25\25 {
 ^^^              ESCAPE SEQUENCE FOR DIGIT 1
    ^             SPACE TO TERMINATE ESCAPE SEQUENCE
     ^^           LITERAL "25"
       ^^^        ESCAPE SEQUENCE FOR %

这种转义在 CSS 中是必要的，因为 CSS 具有适用于类名（以及 ID）的“CSS 标识符”的概念，并且 CSS 标识符既不能以数字开头，也不能包含诸如 @ 之类的字符987654326@。请注意，HTML 类名称以1 开头或包含% 本身没有问题，但是在用CSS 编写它们时，它们必须像这里所做的那样进行转义。如果进行了转义，您可以在类名中包含任何字符，除了用于分隔类名的空格字符。

来自spec：

标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码

反斜杠转义允许作者引用他们无法轻易放入文档中的字符。在这种情况下，反斜杠后跟最多六个十六进制数字 (0..9A..F)，代表具有该数字的 ISO 10646 ([ISO10646]) 字符

如果 [0-9a-fA-F] 范围内的字符跟在 16 进制数后面，则需要明确数字的结尾。有两种方法可以做到这一点：使用空格，或提供六位十六进制数字。

也就是说，上面也可以写成

\00003125\25

省略31 之后的空格，因为已指定完整的六个十六进制数字。

其实百分号不需要使用ASCII码；相反，这也可以写成（稍微）更具可读性

\31 25\%

直接转义百分号。

我将把它留给 CSS 语言专家来决定是否应将使用带前导数字的类名或包含非标准字符视为最佳实践。就个人而言，我认为它没有任何问题。

【讨论】：

作为一名 CSS 专家，我同意。 CSS 有一个非常具体的标识符语法并不是标记语言的错。如果你想限制你的标记以避免编写神秘的 CSS，那很好。但并不是每个人都拥有——或想要行使——对他们的标记的那种程度的控制，这也很好。这就是 CSS 提供转义序列的原因。