Antd：需要改变折叠体的背景颜色

Question

我在项目中使用了一个样式化的 Collapse 元素，然后在打开折叠时我似乎无法覆盖实际主体的背景颜色。

我通过使用样式化组件对其进行样式化创建了一个自定义折叠。我以Collapse.Panel为目标并设置了背景颜色，但没有任何改变。

我什至创建了一个body 元素并将其放置在我的折叠元素中，围绕着我的其余元素，并在其上设置背景颜色。

当背景颜色出现时，它在我的所有元素周围放置了一个框，在主体边缘和我的新背景之间仍然出现白色边距

我在这里创建了一个沙盒来更好地表达我的意思。有什么帮助/建议吗？

Answer 1

尝试覆盖css类.ant-collapse-content检查example：

const StyledCollapse = styled(AntCollapse.Panel)`
  &&& {
    border: none;
    border-radius: 0px;
    background-color: #f7f7f7;
    box-shadow: none;
  }
  .ant-collapse-content {
    background: palegreen;
  }
`;