jQuery UI - 自动完成生成的内联样式覆盖? [英] jQuery UI - Autocomplete generated inline style override?

问题描述

我正在使用 jQuery 自动完成插件，它会在出现建议时生成以下标记.>

I'm using jQuery Autocomplete plugin which, generates following markup when suggestions show up.

<ul class="ui-autocomplete ui-menu ui-widget ui-widget-content ui-corner-all" role="listbox" aria-activedescendant="ui-active-menuitem" style="z-index: 16; width: 1355px; position: relative; top: -1615px; left: 40px; display: none; ">
    <li class="ui-menu-item" role="menuitem">
        <a class="ui-corner-all" tabindex="-1">java</a>
    </li>
    <li class="ui-menu-item" role="menuitem">
        <a class="ui-corner-all" tabindex="-1">javascript</a>
    </li>
</ul>

我的理解是，它使用 UI Position 插件相对于输入字段定位.但是里面生成的style="z-index: 16; width: 1355px; position: relative; top: -1615px; left: 40px; display: none; "，宽度比我的输入框长很多.由于这是模块添加的内联样式，我无法使用 ui-autocomplete 选择器覆盖它.有什么想法吗?

My understanding is, it's using the UI Position plugin to position it relative to the input field. But inside generated style="z-index: 16; width: 1355px; position: relative; top: -1615px; left: 40px; display: none; ", width is much longer than my input field. Since this is inline styles added by the module, I can not override this using ui-autocomplete selector. Any ideas?

推荐答案

在css中使用!important方法:例如

Use the !important method in css: e.g.

.ui-autocomplete {
    width:200px !important;
}

这篇关于jQuery UI - 自动完成生成的内联样式覆盖?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！