如何在Jquery中仅更改Div标签的标题背景颜色

I have a div tag in my modal dialog built using JQuery like this: div id="dialogxxxx" title="xxxxx" . I want to just change the font and background color of the title alone, i.e. only the place where the title is displayed. Right now it has a default color and font. I want to change it to a specific color, but do not want to change the background color and font of the entire div, just the place where the title is displayed. Is there a way to do this? I tried adding style tag to the div, but that changes the background color of the entire div, not the title alone. I also tried doing div#title, that didnt help either.

我在使用JQuery构建的模态对话框中有一个div标签，如下所示：div id =“dialogxxxx”title =“xxxxx”。我想只改变标题的字体和背景颜色，即只改变标题的显示位置。现在它有一个默认的颜色和字体。我想将其更改为特定颜色，但不想更改整个div的背景颜色和字体，只需要更改标题的显示位置。有没有办法做到这一点？我尝试将样式标记添加到div，但这会改变整个div的背景颜色，而不是单独的标题。我也试过做div＃title，这也没有帮助。

Any pointer/help is greatly appreciated.

非常感谢任何指针/帮助。

Thanks,

谢谢，

Asha

阿莎

1 个解决方案

#1

If you want a quick-n-dirty way, you can simply override the .ui-widget-header css rule, e.g.

如果你想要一种快速肮脏的方式，你可以简单地覆盖.ui-widget-header css规则，例如

.ui-widget-header {
  background: red;
}

See this in action: http://jsfiddle.net/william/NgVAu/.

请参阅此操作：http：//jsfiddle.net/william/NgVAu/。

If you want a more maintainable approach, you should use the ThemeRoller, configuring the "Header/Toolbar" section. If you open up your css file, you can find a URL to the ThemeRoller with the theme it's using. It is located in the second lot of comment, after "To view and modify this theme", e.g.

如果您想要一种更易于维护的方法，则应使用ThemeRoller，配置“标题/工具栏”部分。如果打开css文件，可以找到ThemeRoller的URL以及它正在使用的主题。它位于第二批评论中，在“查看和修改此主题”之后，例如，

/*
 * jQuery UI CSS Framework @VERSION
 *
 * ...
 * http://docs.jquery.com/UI/Theming/API
 *
 * To view and modify this theme, visit http://jqueryui.com/themeroller/?...
 */

#1