jquery ui - 由引导程序覆盖的日历年颜色

时间：2015-09-25 22:38:32

标签： css twitter-bootstrap jquery-ui

我的jQuery UI日历的css样式被bootstrap css样式覆盖。

请参阅以下快照...日历的年份文字颜色不是黑色。

enter image description here

原因是，bootstrap css覆盖了jQuery css。在浏览器开发人员视图中，如果我取消选中以红色标记的样式，则绿色箭头中的样式将启用，一切看起来都正常。

enter image description here

问题：

我应该如何解决这个问题？任何建议都表示赞赏。

1 个答案:

答案 0 :(得分：1)

管理CSS的顺序有各种规则。通常，当两个规则适用于同一个元素时，名为 LAST 的规则将取代名为 FIRST

因此，在您的情况下，我建议在 bootstrap.css 之后加载 jquery-ui.css 。

<head>中的订单应为：

 <link rel="stylesheet" href="path/to/bootstrap.css">
 <link rel="stylesheet" href="path/to/jquery-ui.css">

备注：

在bootstrap.css之后应该放置jquery-ui.css的另一个原因是样式结构。 Bootstrap.css管理整个文档，它是一个样式和结构框架，而jquery-ui.css仅适用于选择元素。

或者，如果你的目的是修改jQuery UI元素，我建议创建一个自定义样式表（也放在两个文档之后），而不是改变jquery-ui.css或bootstrap-ui.css。但是，这只是为了保持最佳实践方法。

作为最终（和草率）替代方案，将!important应用于您希望用于覆盖的样式，如下所示：color: #fff!important;

相关问题
最新问题