如何以不同的方式设置 jquery ui 的不同元素的样式？

Question

为了以特定方式设置 jqueryui 选项卡的样式，我的团队成员修改了 ui-state-default 类，如下所示

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default 
{ border: 3px solid transparent; 
  background: #F5AD4C 0px 0px repeat-x url(pix/redesign/orangebuttonstrip.jpg); 

  font-weight: bold; color: White;  }

现在的问题是我正在使用 jqueryui 自动完成组合框，它创建了一个具有相同类的按钮元素

因此，我出现了一个背景图像，这使它看起来又丑又大。

如何为不同的元素设置不同的样式？我尝试 puttin button.ui-state-default 作为 jqueryui 覆盖的不同样式。

Answer 1

如下更改标签的当前 CSS 规则：

.ui-tabs .ui-tabs-nav .ui-state-default, 
.ui-tabs.ui-widget-content .ui-state-default, 
.ui-tabs .ui-widget-header .ui-state-default { border: 3px solid transparent; 
  background: #F5AD4C 0px 0px repeat-x url(pix/redesign/orangebuttonstrip.jpg);
  font-weight: bold; color: White;
}

注意：.ui-tabs.ui-widget-content 不是错误，是故意的。这意味着如果这两个类都存在，则按照以下规则设置样式。