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

Roh*_*han 0 css tailwind-css

我正在尝试学习和使用新的实用程序框架,这些实用程序框架最近变得越来越流行。尾风CSS

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

这是为什么?这是为了使CSS理解那里:存在而不是逃避它吗?

Jör*_*tag 8

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

tablet:bold
Run Code Online (Sandbox Code Playgroud)

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

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

因此,如果您有这样的HTML:

<p class="one:two"></p>
Run Code Online (Sandbox Code Playgroud)

而您想要选择该元素,则相应的查询选择器将类似于:

.one\:two
Run Code Online (Sandbox Code Playgroud)