我正在用Tailwind编写这个网站。除了input元素,一切看起来都很完美。
input
<input type="text" className="bg-red-200 text-blue-400" placeholder="Enter some text"></input>
无论我怎么尝试都无法覆盖它。唯一起作用的是globals.css文件中的自定义CSS规则。为什么不起作用?
globals.css
vwkv1x7d1#
Tailwind
latest className
示例:
<div class="bg-black h-screen bg-green-600"></div>
输出:
bg-black被bg-green-600覆盖。在你的例子中,如果你把你的custom class放在right most side中,它将override所有放在它前面的conflicting classes(左边)
bg-black
bg-green-600
custom class
right most side
override
conflicting classes
hmtdttj42#
看起来我定义的自定义样式在某种程度上禁用了顺风样式,尽管CSS是有效的。在顺风配置中禁用我的自定义样式后,OP中的CSS工作。
2条答案
按热度按时间vwkv1x7d1#
Tailwind
在冲突情况下使用latest className
进行样式设置即课程顺序很重要
示例:
输出:
bg-black
被bg-green-600
覆盖。在你的例子中,如果你把你的
custom class
放在right most side
中,它将override
所有放在它前面的conflicting classes
(左边)hmtdttj42#
看起来我定义的自定义样式在某种程度上禁用了顺风样式,尽管CSS是有效的。在顺风配置中禁用我的自定义样式后,OP中的CSS工作。