如何在 Tailwind CSS 中使用具有任意值的类

Posted 2023-03-06

【中文标题】如何在 Tailwind CSS 中使用具有任意值的类

【英文标题】：How in Tailwind CSS to use classes with arbitrary values

【发布时间】：2021-10-20 05:39:38

【问题描述】：

我是 Tailwind CSS 的新手。通过链接https://tailwindcss.com/docs/just-in-time-mode#arbitrary-value-support 我看到我们可以使用具有任意值的类，例如

class="bg-[#1da1f1]"

但浏览器看不到包含[、]、# 等字符的类。

那么如何使用它们或者它们在 Tailwind 中是如何使用的？没看懂

【参考方案1】：

[,],# 等字符在 css 选择器中被转义。 参考——CSS classes with special characters

像这样-

.bg-\[\#333\] 
    --tw-bg-opacity: 1;
    background-color: rgba(51, 51, 51, var(--tw-bg-opacity));