是否可以在 CSS 类名中使用空格字符？

Question

我有一个计算机生成的类名的情况，其中类名可能包含空格字符（我无法直接控制转换为类名的 ID）。我想出了如何转义 CSS 中的所有字符（请参阅Whichcharacters are valid in CSS class name/selectors?和http://mathiasbynens.be/notes/css-escapes中的优秀答案）。

但我没有设法在 HTML 代码的 CSS 类名中转义空格字符。

我现在使用了避免空格的解决方案，但我很好奇是否/如何可以转义类属性值中的空格字符。

例如：我的班级名称是"a b"。

我可以在 CSS 中将 CSS 选择器编写为.a\20 b { }.

但是 在属性中使用，例如，<div class="a&#x20;b"/>将被解释为相同<div class="a b"/>，这定义了两个类。

Answer 1

https://html.spec.whatwg.org/multipage/dom.html#classes

\n\n

\n

当在 HTML 元素上指定时，该class属性必须具有一个值，该值是一组空格分隔的标记，表示该元素所属的各个类。

\n

\n\n

当然，\xe2\x80\x99 可以转义空格字符，例如 \xe2\x80\x94 HTML 属性值可以包含字符引用https://html.spec.whatwg.org/multipage/syntax.html#syntax -属性值：

\n\n

\n

属性值是文本和字符引用的混合，但文本不能包含不明确的 & 符号这一附加限制除外。

\n

\n\n

然而，\xe2\x80\x99 对于上述语句的应用来说，空格是否经过 HTML 转义并不重要。HTML 编码的空格字符仍会解码为空格字符，因此class="a b"仍会生成 \xe2\x80\x9ca 一组空格分隔的标记\xe2\x80\x9d。请参阅https://html.spec.whatwg.org/multipage/parsing.html#attribute-value-(double-quoted)-state了解如何解析双引号属性值。

\n