html - 如何使用 CSS 覆盖内联样式？

Question

我正在尝试覆盖由第 3 方 API 设置的内联样式， 有问题的元素

<li class="BrainhubCarouselItem BrainhubCarouselItem--active" 
style="padding-right: 25px; padding-left: 25px; width: 225px; 
max-width: 225px; min-width: 225px;"/>

我试过这样选择元素

li.BrainHubCarouselItem.BrainHubCarouselItem--active {
  padding-left: 3px !important;
  padding-right: 3px !important;
  width: 100px !important;
  min-width: 100px !important;
}

但是没有任何样式发生

Answer 1

将 BrainHubCarouselItem 更改为 BrainhubCarouselItem(H 到 h)

li.BrainhubCarouselItem.BrainHubCarouselItem--active { .... }

所以你的 css 看起来像这样

li.BrainhubCarouselItem.BrainhubCarouselItem--active {
  padding-left: 3px !important;
  padding-right: 3px !important;
  width: 100px !important;
  min-width: 100px !important;
}