Jquery UI：如何在同一页面上为 Tabs 和 Slider 定义不同的 CSS 样式

Question

我在同一页面上有两个使用相同样式表的元素：Jquery Tabs 和 Jquery Slider。

我无法重新定义滑块的类，因为 css 的更改会影响这两个元素。

使用这些类的选项卡：

ui-tabs ui-widget ui-widget-content ui-corner-all

这些在 Slider 中使用：

ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all

如何在不修改标签的情况下修改滑块 css？

谢谢

Answer 1

告诉你的风格该做什么:)

css

.ui-slider{
 /* regular used in other areas etc, etc */
}

#mySlider.ui-slider {
/* forced styles, whatever, etc, etc */
}

或为多个滑块使用类名，例如：

.customSlider.ui-slider {

}
.customSlider.ui-corner-all {

}

html

<div id="mySlider" class="slider"></div>
or
<div class="customSlider"></div> 

我应该在 css 上指定：

您可以为选择器指定多个限定符.. css 像这样：

#idOfElement.classname {
 /* will only match items with id of "idOfElement" and class of "classname"
  <div id="idOfElement" class="classname" ></div> */
}

div.classname.classname2 {
  /* will only match divs with both classnames:
   <div class="classname classname2" ></div> */
}

希望这能让您对正在发生的事情有一个很好的了解......