为什么顺风CSS类名称中会有反斜杠？

Question

我正在尝试学习和使用一个新的实用程序框架，该实用程序框架最近变得非常流行。 TailwindCSS

当我按照文档中的说明编译CSS时，我看到很多CSS类名中都带有冒号:，并且前面加反斜杠\

那是为什么？是让CSS理解那里有:而不是逃避它吗？

Answer 1

Tailwind使用带有冒号的类名作为其对响应式设计的支持的一部分。特别是，一个类名，例如

tablet:bold

意味着应该应用类bold中定义的属性，但前提是媒体与定义为tablet的媒体查询匹配。

冒号是HTML5类名称中的完全有效字符。但是，它是CSS选择器中的保留字符。因此，如果要选择名称包含冒号的类中的元素，则需要对冒号进行转义。

因此，如果您有这样的HTML：

<p class="one:two"></p>

您要选择该元素，相应的查询选择器将类似于：

.one\:two