当一个我无法访问的外部样式表出现时，将样式应用到其他div的最佳方法？

Question

我正在使用BXSlider并试图改变滑块的每一次均匀迭代的背景。问题是一个我无法访问的CSS表影响了页面上所有的滑块。

Context-

<div class="bx-wrapper">
  <div class="bx-viewport">
    <div class="bx-slider">
    </div>
   </div>
  </div>

Bx-wrapper和Bx-viewport是通过bxslider库自动添加的。

css表(我无法访问)的背景设置为#fff-。

.bx-wrapper .bx-viewport {

    background: #fff;
  }

我正在用-改变滑块的背景。

.bx-wrapper .bx-viewport:nth-child(even){
	background-color: rgb(245,245,245);
	
}

我的主要问题是，原来的#fff优先，我只有在开发工具中取消勾选该样式时才能看到上面的css工作。你们认为最好的方法是什么，以确保上面的css优先？

Answer 1

听起来你的样式只是被现有的样式表覆盖了，对吗？

为了让你的样式优先于现有的样式表，你的CSS范围应该尽可能的具体，如果必要的话，应该包含以下内容 !important 属性。

例如，你可以尝试...

.bx-wrapper .bx-viewport:nth-child(even){
    background-color: rgb(245,245,245);
} 

...你可能想试试...

html body .bx-wrapper .bx-viewport:nth-child(even){    /*or whatever the full scope path to your elements would be*/
    background-color: rgb(245,245,245) !important;  
}

我希望这就是你要找的。