我有个问题
我有一个使用Tailwindcss进行样式设置的输入字段,如https://codesandbox.io/s/tailwind-cra-forked-v0cx3?fontsize=14&hidenavigation=1&theme=dark中所示
我在删除输入和自动填充中的背景时遇到了麻烦。似乎什么都不起作用。
有人能帮忙吗?谢谢
我有个问题
我有一个使用Tailwindcss进行样式设置的输入字段,如https://codesandbox.io/s/tailwind-cra-forked-v0cx3?fontsize=14&hidenavigation=1&theme=dark中所示
我在删除输入和自动填充中的背景时遇到了麻烦。似乎什么都不起作用。
有人能帮忙吗?谢谢
3条答案
按热度按时间b4lqfgs41#
我在Chrome/Webkit浏览器中遇到了自动填充的问题,多亏了this CSS tricks article,我才能通过将以下内容添加到我的
globals.css
中来修复它:从Tailwind 3开始,您还可以使用
autofill
伪类,但我没有发现这有什么帮助:https://tailwindcss.com/docs/hover-focus-and-other-states#autofill
在这里,我把它和“重要修饰语”结合起来:https://tailwindcss.com/docs/configuration#important-modifier
jei2mxaa2#
尝试使用 * 背景色 * 实用程序。
请参见此处https://tailwindcss.com/docs/background-color
例如,包含实用程序
bg-red-900
会将元素的背景色更改为暗红色。下面将它应用于您的代码示例...
结果就是...
91zkwejq3#
我使它的工作与自动前缀所描述的顺风官方文件。
我们的想法是安装
autoprefixer
并将其添加到Tailwind插件中。你可以这样做:添加到
tailwind.config.js
或您的PostCSS配置:然后,当您在Tailwind中编写
autofill:something
时,它将添加类似-webkit-autofill
的规则。要更改自动填充的背景色,实际上需要如下设置
box-shadow
:这将设置一个黄色的嵌入框阴影时,您的输入字段自动填充。