用户界面-在特定组件上重写jQuery UI样式

Question

就像我喜欢themeRoller一样，我希望能够操纵和替换一些jQuery UI组件的css样式，特别是按钮。

我已经成功地改变了字体和大小，但我无法改变背景图像和填充。我在主题css文件中查找了一下，希望找到一些可以覆盖的内容，但似乎没有任何工作。

有人能给我一些关于如何正确实现下面的代码的见解吗?: P

. css文件

#create-user .ui-button
{
    background-image: none;
}

名为. xhtml文件

<button id="create-user">Create</button>

Answer 1

尝试以下命令来强制执行:

#create-user .ui-button
{
    background-image: none !important;
}

手动编辑由meroller生成的原始CSS文件可能是一个更好的主意。

你也可以在调用.button()之后尝试删除一些类。按钮的外观主要由ui-state-default和ui-corner-all控制。尝试删除这些，看看您的自定义类是否开始工作。它还动态添加了ui-state-hover和ui-state-active。

总而言之，不使用jQuery UI按钮可能更容易，如果只是一些特殊情况，请尝试自己设计样式。

Answer 2

这可能对你有帮助:

创建一个新类。不要编辑当前的类，它也可能在其他地方使用。最好的方法是创建一个新类:

.button_style{
  background:none !important;
  padding:5px !important;
 }

修改css。使用css hack '!important'.