在迎风css中动态设置悬停值
在迎风css中动态设置悬停值
提问于 2022-03-04 11:07:38
我想设置一个不同的文本颜色悬停取决于类别名称与顺风。我设置了一个配置，每个颜色代码引用如下所示的类别：
tailwind.config.js
theme: {
extend: {
}
},
colors: {
transparent: 'transparent',
current: 'currentColor',
"animation": "#A72608",
"decor": "#E0AFA0",
"illustrations": "#32936F",
"developpement-visuel": "#C2FCF7",
"realisations": "#FEEA00",
"croquis": "#9F6BA0",
"white": "#FFFFFF",
},在我的组件中这样使用：
sidebar.js
<nav>
<ul>
{categories.map((category) => {
return (
<li key={category.id} className="mb-4">
<Link href={`/category/${category.attributes.slug}`}>
<a className={`hover:text-${category.attributes.slug} uppercase font-light text-sm`}
>{category.attributes.name}</a>
</Link>
</li>
)
})}
</ul>
</nav>但结果证明它不起作用。当我看到devtools ${category.attributes.slug}实际上被替换为类别的名称和我在配置中指定的名称
回答 1
Stack Overflow用户
发布于 2022-03-04 20:29:01
您能否尝试在tailwind.config.js中设置文本颜色的悬停效果？
module.exports = {
variants: {
textColor: ['group-hover', 'hover'],
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71356173
复制相关文章
相似问题
迎风CSS在悬停时隐藏div不隐藏
在迎风css中悬停按钮时如何改变笔画颜色
响应侧栏迎风css
迎风CSS类显示在DOM中，但没有应用样式
添加css a:在VB代码中动态悬停
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
社区富文本编辑器全新改版！诚邀体验～
全新交互，全新视觉，新增快捷键、悬浮工具栏、高亮块等功能并同时优化现有功能，全面提升创作效率和体验
腾讯云开发者
