CSS 类选择器中允许使用哪些字符 / 符号？我知道以下字符无效 ，但哪些字符有效 ？
~ ! @ $ % ^ & * ( ) + = , . / ' ; : " ? > < [ ] \ { } | ` #您可以直接检查CSS 语法 。
基本上 1 ，名称必须以下划线（ _ ），连字符（ - ）或字母（ a - z ）开头，后跟任意数量的连字符，下划线，字母或数字。有一个问题：如果第一个字符是连字符，则第二个字符必须是2个字母或下划线，并且名称长度必须至少为 2 个字符。
-?[_a-zA-Z]+[_a-zA-Z0-9-]*简而言之，之前的规则转换为以下内容，从W3C 规范中提取。 ：
在 CSS 中，标识符（包括选择器中的元素名称，类和 ID）只能包含字符 [a-z0-9] 和 ISO 10646 字符 U + 00A1 和更高，加上连字符（ - ）和下划线（_） ; 它们不能以数字开头，也不能以数字后跟连字符开头。标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码（请参阅下一项）。例如，标识符 “B＆W？” 可以写成 “B \＆W \？” 或 “B \ 26 W \ 3F”。
以连字符或下划线开头的标识符通常保留用于特定于浏览器的扩展，如-moz-opacity 。
1通过包含转义的 unicode 字符（没有人真正使用），这一切都变得更加复杂。
2请注意，根据我链接的语法，以两个连字符开头的规则（例如--indent1 ）无效。但是，我很确定我在实践中已经看到了这一点。
令我惊讶的是，大多数答案都是错误的。事实证明：
CSS 中的 CSS 类名允许除 NUL 之外的任何字符。 （如果 CSS 包含 NUL（转义或不转义），则结果未定义。[ CSS-characters ]）
Mathias Bynens 回答了解释和演示的链接，展示了如何使用这些名称。 写在 CSS 代码中，类名可能需要转义 ，但这不会改变类名。例如，不必要的过度转义表示将与该名称的其他表示看起来不同，但它仍然引用相同的类名。
大多数其他（编程）语言没有转义变量名称（“标识符”）的概念，因此变量的所有表示都必须看起来相同。 CSS 中不是这种情况。
请注意，在 HTML 中，无法在类名属性中包含空格字符（空格，制表符，换行符，换页符和回车符） ，因为它们已经将类彼此分开。
因此，如果您需要将随机字符串转换为 CSS 类名称：处理 NUL 和空间，并转义（相应地为 CSS 或 HTML）。完成。
阅读W3C 规范 。 （这是 CSS 2.1，找到适合您的浏览器假设的版本）
编辑：相关段落如下：
在 CSS 中，标识符（包括选择器中的元素名称，类和 ID）只能包含字符 [a-z0-9] 和 ISO 10646 字符 U + 00A1 和更高，加上连字符（ - ）和下划线（_） ; 它们不能以数字开头，也不能以数字后跟连字符开头。标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码（请参阅下一项）。例如，标识符 “B＆W？” 可以写成 “B \＆W \？” 或 “B \ 26 W \ 3F”。
编辑 2：正如 @mipadi 在 Triptych 的回答中指出的那样，有一个警告 ，也在同一个网页中：
在 CSS 中，标识符可以以 “-”（破折号）或 “_”（下划线）开头。以“-” 或“_” 开头的关键字和属性名称保留给特定于供应商的扩展。此类特定于供应商的扩展应具有以下格式之一：
'-' + vendor identifier + '-' + meaningful name '_' + vendor identifier + '-' + meaningful name例子）：
例如，如果 XYZ 组织添加了一个属性来描述显示器东侧边框的颜色，则可以将其称为 - xyz-border-east-color。
其他已知的例子：
-moz-box-sizing -moz-border-radius -wap-accesskey保证初始破折号或下划线永远不会被任何当前或未来的 CSS 级别用于属性或关键字。因此，典型的 CSS 实现可能无法识别这些属性，并且可能根据用于处理解析错误的规则来忽略它们。但是，因为初始短划线或下划线是语法的一部分，所以 CSS 2.1 实现者应始终能够使用符合 CSS 的解析器，无论它们是否支持任何特定于供应商的扩展。
作者应避免特定于供应商的扩展