我正在尝试学习并使用一种新的实用框架,这在当今非常流行。 TailwindCSS
按照文档的说明编译我的 CSS 时,我发现很多 CSS 类名中都有冒号:
,并且前面有反斜杠\
为什么会这样呢?这是为了让 CSS 理解那里有一个:
而不是转义它吗?
我正在尝试学习并使用一种新的实用框架,这在当今非常流行。 TailwindCSS
按照文档的说明编译我的 CSS 时,我发现很多 CSS 类名中都有冒号:
,并且前面有反斜杠\
为什么会这样呢?这是为了让 CSS 理解那里有一个:
而不是转义它吗?
Tailwind使用带有冒号的类名作为其响应式设计支持的一部分。特别地,像
tablet:bold
如果媒体匹配定义为tablet
的媒体查询,则应用于类bold
中定义的属性。
在HTML5类名中,冒号是一个完全有效的字符。然而,在CSS选择器中,它是一个保留字符。因此,如果您想选择类名包含冒号的元素,您需要转义冒号。
因此,如果您有以下HTML:
<p class="one:two"></p>
如果你想选择那个元素,对应的查询选择器可能是这样的:
.one\:two
document.querySelector(".one\\:two");
。您可以在https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector上找到更多信息。 - undefined