jquery ui标签主要风格的变化
我正在使用jquery UI选项卡，我需要主要更改它的样式。 我需要重新审视背景图像，边框，几乎所有东西。 我需要它看起来很小，而不是像它自成一体。
最好的方法是什么？ 我需要使用日历小部件的默认UI样式，它位于同一页面上。 我做了很多研究，每个人似乎都指向主题 – 滚动。 但是，我不只是想改变颜色和边框半径。 我需要删除废话。 主题 – 滚动似乎只是改变颜色之类的东西（对现实世界不是很有用）。 如何在不改变同一页面上其他UI小部件的样式的情况下调整选项卡的css（我希望日历保持不变）？
是否值得为我的标签使用jquery UI？
你应该查看Keith Wood关于样式化JQuery UI Tabs的详细博客文章。
您具体问题的答案
我需要重新审视背景图像，边框，几乎所有东西。 我需要它看起来很小
在本节中“ 删除 Keith Wood的post的大部分格式 ”。
除此之外，还有10个样式更改，完成了实现所需效果所需的CSS。
JQuery UI标签样式 – Keith Wood博客文章
我选择编写自己的简单选项卡function时，我意识到我不需要其大部分内置function，例如加载AJAX内容和动态添加/删除选项卡。 如果我需要这些function，我自己很容易实现它们。 是什么推动我抛弃jQuery UI Tabs，我必须以不同的方式构建我的DOM元素。 我还需要将我的标签设置为最小化，并且我认为从头开始构建将比尝试去除很多东西要少。
我最想念的function是jQuery UI选项卡如何自动选择URL中＃所指示的选项卡（我知道我可以复制它 – 还没有达到它）。
更新：但是，是的，如果您坚持使用它，您可以使用您拥有的任何ID覆盖CSS：
#my-tabs .ui-state-default { background-image: none; /* remove default bg image */ } 等等..
在您的CSS中尝试以下内容，假设您的类是.mytabs用于覆盖css。 它应该让你开始
.mytabs li { background : white !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; } .mytabs li.ui-state-active { background : white !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; margin: 0; } .mytabs li a { color: Black !important; font-size: 1.4em !important; font-weight: bolder; padding: 4px 1.5ex 3px !important; }
使用一些CSS很容易，你可以轻松覆盖jQuery UI提供的标准CSS。 如果修改后的CSS出现在jQuery UI CSS之后，您可能不需要！important。
您还可以在加载jQuery时删除/添加每个元素的类，但这似乎有点不必要。
使用CSS应该相当简单。 您的元素上有ID和类，您可以使用CSS触摸它们。 Themeroller只是一个快速的事情。
如果我记得，您还可以调整选项卡js并调整添加图像的行（如果这是相同的插件），或者只是根据自己的喜好删除该行。
我想知道！important属性是否应该首先出现在默认的jquery ui模板中。 例如，如果您将标签更改为左侧或右侧而不是顶部，则“border-bottom”不应具有！important，因为这通常会被覆盖。
这里几乎涵盖了所有内容，但我环顾四周，找到了一种方法来折腾你真正不需要的东西，只需一个类，然后编辑其余的属性。
*[class*="ui-"] { border-radius:0; background-image: none; . . . }
这样您就可以选择以“ui-”开头的每个类，并从jQuery UI中删除要删除的内容。
#my-tabs * { background-image: transparent; }