如何覆盖第三方react组件的默认样式？

Question

我正在处理的项目使用react-responsive-carousel组件，但是，尽管有一个属性可以更改箭头图标，但是没有一个属性可以增加按钮本身的宽度。

有没有办法用自定义css覆盖组件上的填充？

​

​

Answer 1

.carousel.carousel-slider .control-arrow {
  padding: 50px;
}

Answer 2

我建议在包含carousel组件的容器上使用自定义类，并使用它安全地覆盖样式。

在根css文件中：

.my-custom-class .carousel.carousel-slider .control-arrow {
  *styles*
}