Question

如何覆盖主题滚动窗口小部件的默认背景颜色？

multiselect.css

.ui-multiselect { ...
    background-color:#fff;  /* trying to override to display white instead of themerolled blue */
 ...}

的ThemeRoller-custom.css

/* This is the line that I need to somehow override in my control .css */
/* I don't wont't to modify this because datepicker is using this with other widgets */
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border:   
1px solid #c5dbec; background: #dfeffc url(images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x; 
font-weight: bold; color: #2e6e9e; }

Answer 1

这不起作用：

background-color:#fff !important

但是这样做了（在验证css规则之后我的风格没有通过萤火虫划掉）

background:#fff !important;

Answer 2

使属性重要：

.ui-multiselect {
    background-color: #fff !important;
}

否则，选择器必须比原始选择器更具体，或者完全与特定选择器相同，但在原始选择器之后加载（通过稍后包含该样式表）。然而，这两种方式都不清楚或容易，因此使用!important是最好的方式（对于看到CSS的人来说也是最直观的方式 - 他似乎立即想要那个规则而不是其他地方定义的规则）

Answer 3

你试过吗

.ui-multiselect {
   background-color:#fff !important;
}

Answer 4

当我尝试在background-color上设置ui-multiselect时，打开下拉列表时出现问题：标题只是白色而没有显示任何文字。所以我的解决方案是：

.ui-multiselect:not(.ui-state-active) {
    background: #fff !important;
}

因此，后台覆盖仅适用于下拉列表未处于活动状态时。这在旧版本的IE中不起作用。

如何覆盖themeroller背景颜色？

4 个答案: