Question

我从另一个使用jQuery UI的开发人员那里继承了一个项目。

我添加了一些包含jQuery UI对话框和jQuery UI datepickers的页面。

问题是，jQuery UI对话框标题栏中标题的文本与标题栏的颜色颜色相同。在jQuery UI datepicker中，用户点击以更改日历上月份的箭头与背景颜色相同！

我认为这是在jQuery UI CSS中设置的。有人可以告诉我在CSS中我需要进行调整以便文本可见吗？

我的.ui-widget部分如下所示，我在灰色背景上获得灰色小部件和文字：

.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }
.ui-widget .ui-widget { font-size: 1em; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; }
.ui-widget-content a { color: #222222/*{fcContent}*/; }
.ui-widget-header { border: 1px solid #aaaaaa/*{borderColorHeader}*/;  background: #cccccc/*{bgColorHeader}*/ url(images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/;   color: #222222/*{fcHeader}*/;    font-weight: bold; }
.ui-widget-header a { color: #222222 /*{fcHeader}*/; }

更新：我已经给出了以下答案的分数。我发现窗口小部件不可见的原因是我正在处理的程序副本中缺少jQuery UI图像文件！

Answer 1

jQuery UI Theme Roller可以帮助您为jQuery推出自己的主题。如果以前的开发人员使用jQuery，那么他很可能也使用theme roller来构建他的CSS。我会搜索您的文件并查找名称为jquery-ui-*.css的文件，其中*表示版本号（例如1.8.4）。

Answer 2

我看起来像这样

.ui-widget-header { border: 1px solid #aaaaaa; 
background: #cccccc url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) 
50% 50% repeat-x; color: #222222; font-weight: bold; }

我将color: #222222更改为color: red，它只更改了对话框标题中的文字。

如何设置jQuery UI对话框标题栏的文本颜色？

2 个答案: