JqueryUI日期选择器的自定义样式

我在网页上有一个日期选择器，其中包含其他基于jQueryUI的元素。datepicker需要与其他对象具有单独的样式。我的理解是使用themeroller创建特定于datepicker的样式，并使用适当的选择器，在我的例子中是“.dateTextBox”

下面是具有所述类的元素：

<input type="input" class="dateTextBox">

我遇到的问题是，尽管我的textbox添加了一个“.dateTextBox”类，但jquery创建的datepicker元素只有自己的jQueryUi类；我的自定义选择器没有添加到其中，因此themeroller导出的附带自定义css没有被使用，因为它们引用的是代码中不存在的选择器

我已经尝试过在文本框的onclick中添加代码，这将使用dateTextBox类在datepicker容器中的任何元素前面添加代码，但这只会导致一些元素由自定义css设置样式（请参阅jsfiddle，其中datepicker头是蓝色的，如我的css中所设置的，但背景不是红色的，如使用“.ui widget content”类在我的css中所设置的（jsfiddle似乎正在应用其默认的jquerycss，有人知道如何在jsfiddle中禁用它吗？）

它是像themeroller中错误的选择器选择那样简单，还是我手动将选择器类添加到生成的日期选择器中，结果正确

编辑：-感谢大家的帮助。我想澄清一下，我遇到的问题是使用JQuery的themeroller将自定义主题应用于他们自己的控件之一。我可以为我的datepicker从头开始手动创建一个完整的css页面，但我可能会在使用另一个JQuery控件时遇到这个问题

-另外值得注意的是，JSFIDLE为jquery提供了默认的css，只是因为日历出现了，并不意味着它采用了我在css窗口中提供的样式

编辑2:-这是我所指的themeroller网站，似乎人们认为我只是在css本身上遇到了问题。单击下载主题，你会看到范围选择器文本框，它应该允许在一个页面中使用多个不同样式的jquery控件

---

CSS选择器的工作方式是通过赋予点。你越具体，你拥有的点就越多，应用的样式就是拥有更多点的样式

要应用您想要的样式，您有两种解决方案。请在css规则中更加具体。添加ID将使您的选择器更强大：

<input type="input" id="test" class="dateTextBox">
#test.dateTextBox .ui-widget-content { border: 1px solid #aaaaaa; background: #ff0000 }

---

你想要这样的东西吗：？@看起来像我希望的那样工作的对立面，你改变了什么？花5分钟时间阅读关于特殊性的内容，你就会明白我做了什么。我只是使用了容器div的id，它比使用类“更强大”（这是@Salman A已经提出的建议）@这里的对立面是一个更新的示例，它使用id类作为JqueryUI themeroller的选择器，它似乎不起作用。我想澄清的是，我并不是在寻找改变日期选择器背景颜色的解决方案，这只是一个示例。我正试图正确地使用JqueryUI的themeroller，它应该不会o允许用户指定一个选择器，用于设置select控件的样式，而不影响可能使用更基本jquery的其他控件的样式。建议不用于扩展讨论；此对话已结束。

<input type="input" id="test" class="dateTextBox">
#test.dateTextBox .ui-widget-content { border: 1px solid #aaaaaa; background: #ff0000 }

<input type="input" class="dateTextBox" style="border: 1px solid #aaaaaa; background: #ff0000">
$(".dateTextBox").attr("style", "border: 1px solid #aaaaaa; background: #ff0000");

<div id="container" >
    <input type="input" id="test" class="dateTextBox">
    //any other control you like
</div>

#container .dateTextBox .ui-widget-content { border: 1px solid #aaaaaa; background: #ff0000 }