自定义jQuery自动完成组合框CSS

学习

如何自定义jquery自动完成组合框css,以便使它看起来像在图片中以更改其悬停样式? 在此处输入图片说明

我的代码的一部分是

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
.ui-autocomplete, .ui-autocomplete:hover,
.ui-menu-item, .ui-menu-item:hover,
.ui-menu-item a, .ui-menu-item a:hover,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active,
.ui-menu .ui-menu-item a {
    background-color: white;
    text-wrap: none;
    font-weight: normal;
    color: black;
}

.custom-combobox-toggle {
position: absolute;
top: 0;
bottom: 0;
margin-left: -1px;
padding: 0;
/* support: IE7 */
*height: 1.7em;
*top: 0.1em;
width: 40px;
color: white;
border: thin;
border-color: blue;
}

.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding to account for vertical scrollbar */
    position: absolute;
    font-style: normal;
}

图片:现有外观

在此处输入图片说明

j809

您将必须更改CSS .ui-state-focus好吧,这将为您工作:

.ui-autocomplete .ui-menu-item {
  background:white;
}
.ui-autocomplete .ui-state-focus {
    background:rgb(39, 108, 255); //Change blue color to your favourite shade
    color:white;
}

JSFiddle演示

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章