我正在尝试为 React 组件中的 :hover 和 :focus 编写样式。这是我尝试过的。
这是我的组件
<MyBtn className={classes.authBtn}> This is sample text </MyBtn>
在我的样式对象中,我已经按照我在网上找到的一些文档尝试了这些。
authBtn: {
'&:hover': {
backgroundColor: '#1565C0'
}
}
下一步,
'authBtn_hover': {
backgroundColor: '#1565C0'
}
接下来,
authBtn: {
':hover': {
backgroundColor: '#1565C0'
}
}
最佳答案
问题出在 css 样式上。我尝试过被组件内联 css 覆盖的规则。所以悬停也不起作用。我已将 important 添加到规则中,并且它可以正常工作。这是更正后的代码。感谢您的支持。
authBtn: {
backgroundColor: '#1565C0',
'&:hover': {
backgroundColor: '#0D47A1 !important',
}
}
关于javascript - :hover and :focus in javascript css object怎么写,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46802305/