Question

我创建了一个解决方案，卡在jquery ui中做一些工作且看起来很棒的滑块。

我在一个页面上弹出了一个手风琴，它的CSS非常糟糕。但我不知道如何用我自己的CSS替换它，因为它似乎使用了CSS类的绝对TON并且覆盖它们似乎都非常混乱。

推测使用JQuery UI挑选和选择样式和主题是一项常见任务，是否有最佳实践？

我想也许你可以获得单个组件CSS并预编译它或类似。但似乎有许多常见的CSS样式由jquery ui应用。

例如，手风琴会自动应用这些类：

ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active

我可以看到两个包含'accordion'这个词，所以你可以想象'覆盖'（或者应该从jqueryui css中删除代码并将它放入我自己的css类中？）它们没有问题，但是其他人被埋在jquery ui中并在全球范围内压制它们可能会引发问题。

我的目标是使用自己的CSS完全自定义手风琴控件，同时不影响任何其他jquery ui组件。

Answer 1

您需要在样式表中的所有其他样式的末尾重新声明相同的内容，并设置为您要覆盖的自定义值。完成后，在页面末尾重新声明该css文件。希望这会有所帮助。

Answer 2

如果你想保持原来的风格，那么在手风琴周围缠上一个div并根据需要继承css。您可以随时从div中删除该类以获取默认的jquery手风琴。像：

<div class='someClass'> 
<div class='ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active'></div>
</div>

CSS会是这样的：

.someClass .ui-accordion-content { /* your necessary styles */ }

Answer 3

上述两个答案似乎都符合您的需求，为了完整性，尽管您也可以使用jQuery简单地挑选出您不满意的元素来覆盖css，例如。

$(".ui-accordion-content").css("color", "#FFF");

可能比在jquery-ui css中挖掘它更简单，或者重新声明你是否只想改变一两件物品。

如何覆盖特定控件的css？

3 个答案: