如何使用更高特异性的样式覆盖样式 - 样式的组件

发布于 2025-02-06 18:12:39 字数 452 浏览 1 评论 0原文

我阅读了样式的组件文档，并了解了如何超越某些样式的基础知识，但是在我的情况下我无法弄清楚这一点。

我需要覆盖DIV中的某些类，

因此我的结构看起来像这样：

如何从样式组件的更特异性中实现这一目标，而不是！

export const SomeDiv = styled.div`
  .someClassName  {
    left: ${(props) => props.left || 0} !important;
    ${(props) =>
    props.top &&
    `
         top ${props.top} !important;
    `}
  }
 `

原文

I read styled components docs and know the basics how to override some styles, but I can't figure out this in my case.

I need to override some class in my div

So my structure looks like this:

How Can I achieve this with higher specificity from styled components instead !important

export const SomeDiv = styled.div`
  .someClassName  {
    left: ${(props) => props.left || 0} !important;
    ${(props) =>
    props.top &&
    `
         top ${props.top} !important;
    `}
  }
 `

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

软甜啾 2025-02-13 18:12:39

export const SomeDiv = styled.div`
  .someClassName {
    &&& {
      left: ${(props) => props.left || 0} !important;
      ${(props) =>
      props.top &&
      `
           top ${props.top} !important;
      `}
    }
  }
 `

github问题

export const SomeDiv = styled.div`
  .someClassName {
    &&& {
      left: ${(props) => props.left || 0} !important;
      ${(props) =>
      props.top &&
      `
           top ${props.top} !important;
      `}
    }
  }
 `

Github issue

回复收藏 0 原文

~没有更多了~