如何覆盖 JS 应用 CSS

Question

我正在使用第 3 方多 select 下拉菜单。 如果您听说过 select2，您就会明白。 多个 Select 下拉菜单是通过名为 select2.min.js 的 JQuery 创建的，下拉菜单的宽度是自动计算的。 如何在其上应用 static，因为据我所知，js 应用的 css 是最高优先级。

按照 JQuery 生成代码

<span class="select2 select2-container select2-container--default select2-container--focus" dir="ltr" data-select2-id="1" style="width: 323px;"><span class="selection"><span class="select2-selection select2-selection--multiple" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="-1" aria-disabled="false">
  <ul class="select2-selection__rendered">
    <li class="select2-search select2-search--inline"><input class="select2-search__field" type="search" tabindex="0" autocomplete="off" autocorrect="off" autocapitalize="none" spellcheck="false" role="searchbox" aria-autocomplete="list" placeholder="" style="width: 0.75em;"></li>
  </ul>
</span></span><span class="dropdown-wrapper" aria-hidden="true"></span></span>

Answer 1

对 CSS 使用!important属性。

Answer 2

有几种方法可以删除 CSS，每种方法都有自己的优先级。 在您的情况下，简单地将.important 添加到 css class 可以修复它。 但是，如果您希望将来更改该值，则可能会遇到困难。

您可以尝试使用 Jquery.css() function 更改 css 值，看看是否有帮助。 如果没有，您可以尝试在 css 中编写更具体的 selecotr，它比库中的默认优先级具有更高的优先级。