javascript - jQuery UI 自动完成 - 引用 jQuery UI 主题样式表时的自定义样式

Question

我正在使用 jQuery UI Autocomplate plugin就像第一个例子一样。我还有其他插件引用的 jQuery UI 主题样式表。

这是我正在使用的输入:

CSS:

div.formvalue {
    background-color: #eee;
    border: 1px solid red;
    padding: 10px;
    margin: 0px;
}

div.paddedInput {
    padding: 5px;
    border: 1px solid black;
    background-color: white;
}

div.paddedInput input {
    border: 0px;
    width: 100%;
    outline:none;
}

HTML:

<div class="formvalue">
    <div class="paddedInput"><input type="text" value="Padded!" /></div>
</div>

这是我的情况:

由于上面的 div 元素用作输入元素(从样式的 Angular 来看)，自动完成列表看起来有点尴尬，因为它为输入元素设置了自己。

我挖掘了 jQuery UI 为自动完成功能创建的源代码，并且有 ui-autocomplete 样式类，但正如我所说，但我不知道 auto 我应该覆盖什么。

有什么想法吗？

更新:

这是 jsfiddle 示例:

http://jsfiddle.net/tugberk/YxRYe/4/

Answer 1

如果你想覆盖你的风格，你可以使用!important关键字作为这段代码

div.paddedInput input {
    border: 0px!important;
    width: 100%;
    outline:none;
}