React Styled-Components CSS向子元素添加!important

牛奶

我有一个想要!important在某些子元素上进行样式设置的组件。

有可能&&&用来实现这一目标吗?

我已经尝试了以下方法,但是不起作用:

const StyledTitle = styled(Title)`
  &&& span {
      text-align: center;
      font-weight: bold;
  }
  span &&& {
      text-align: center;
      font-weight: bold;
  }
`
安迪·麦卡洛

如果您尝试覆盖内联样式,则只需添加即可!important归结为CSS特异性-https: //www.w3schools.com/css/css_specificity.asp

内联样式具有很高的特异性得分,如果不使用,很难覆盖 !important

多种&样式中的组件用于提高特定性,但是您必须滥用这一点才能推翻内联样式。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

React Styled-Components:参考其他组件

如何在React Styled-Components中设置子组件的样式

React Styled Components条件三元运算符

使用React Styled Components在两种类型的组件之间共享相同的样式

React Styled Components-如何访问原始HTML

styled-components表示在您的React组件(Component)周围包装了styled()

React Styled-Components主题-提供者动态主题

React Styled-Components 3个按钮大小

用React Styled-Components导入scss变量的最佳方法?

React + Styled Components-分离并重复使用CSS“捆绑包”

在新的React版本中,如何修复TypeError:styled_components__WEBPACK_IMPORTED_MODULE_3__.default.dev?

nextjs + react-native-web + styled-components:warnOnce

使用状态来自定义样式的react + styled-components

React Styled-Components-如何根据道具条件或伪类渲染样式?

TypeError:styled_components__WEBPACK_IMPORTED_MODULE_0 __。default.vedio不是对React的函数

React Styled-Components 传递道具问题

React Styled Component 的 CSS 方法优化

导入 .less 变量以在 React Styled Components 中使用

Styled-components vs Emotion - 如何在 Styled-components 上重新应用 css`style` 函数

React, styled-components - 显示光标:指针;如果菜单打开,在页面上?

将 calc() 与 react-native 和 styled-components 一起使用时出错

如何在 React - typescript - Styled-components 应用程序中使用单击事件修改 DOM?

如何在 React Styled Components 中仅为一个道具制作多种样式?

React Styled Components:ReferenceError:初始化前无法访问

React-Native-Styled-Components:类型“DefaultTheme”上不存在属性“backgroundColor”

nx React/Next.js styled-components 共享类型声明文件 styled.d.ts

Styled Components 渲染基于 props 的 Styled 标签

Storybook + Ionic React + styled-components CSS 順序問題

React Styled Components - 如何更改地图功能中单击元素的颜色?