jQuery UI - 添加第二个按钮类型

Question

我正在使用 jQuery UI 来设置网站的样式。我想要做的是添加另一种比“正常”更突出的按钮类型。因此，对于表单提交等所有按钮。我想使用主题的“默认”样式，但我想制作一类具有不同颜色且更大的新按钮。

理想情况下，我不想更改我拥有的 jQuery CSS 和 js。我查看了生成的 CSS，看起来我必须复制很多东西才能放入我的第二个类中，然后我必须以某种方式将所有这些类应用于我想要在第二个按钮中设置样式的元素风格。

有没有一种方法可以轻松地将小部​​件样式添加到 jQuery UI，“继承”现有的小部件样式，并且只是覆盖一些属性？谢谢。

Answer 1

您有用于 jqueryUI 的 ThemeRoller，您可以在其中设计自己的自定义主题。这是最简单的方法。

否则，如果我想使用自定义按钮而不是 jqueryUI 附带的按钮，我要做的是选择默认的 jquery 按钮样式（假设类是 .ui-button）并创建更高指定的选择器并仅更改设置我需要与众不同（通常是背景图片、填充、边框 - 您不想更改与布局相关的 css，因为它会弄乱您的小部件）。

类似：

.ui-button {default jquery css style}
.my-custom-form .ui-button {my custom css style}

它会覆盖你的风格。您需要注意的是您的选择器比 jqueryUI css 文件中的选择器更强。如果将它放在默认 css 中对您来说看起来很乱，您可以将它放在您的 .css 中。我通常有一个 div 来包装我的输入字段或按钮容器，并向其中添加自定义 id 或类，并使用该类/id 来设置我的按钮的样式。