更改引导活动标签颜色内嵌

时间:2016-04-04 15:00:32

标签: jquery html css twitter-bootstrap

这是我的问题,我正在尝试从自定义样式表中的类设置我的引导选项卡的活动颜色。我计划使用的css类如下:

{
  font: 9pt Tahoma;
  color: #000000;
  border: solid 1px #A8A8A8;
  padding: 3px 12px 4px 12px;
  background-color: red;
  text-align: center;
}

这是有趣的地方。当页面发布到客户端时,每个客户端都会有一个具有不同值的自定义CSS文件(这是一个更新版本) - 结构上与上面的CSS类相同(显然除了值)。这意味着我无法向CSS文件添加任何更多属性,我所做的任何修改都将在.aspx中完成,因此它们将适用于每个客户端。

所以我的挑战是将标签的活动颜色更改为CSS文件中的内容,在这种情况下它将是: background-color:red

在这种情况下实际上不适用的简单解决方案是添加另一个具有以下内容的类:

.nav-pills > li.active > a{
color: red;
}

正如我所提到的,这不适用于这种情况。

我曾考虑尝试在DOM加载时使用JQuery读取背景颜色,但我不确定如何解决这个问题。

任何指导都会很棒!即使只是告诉我这是不可能的。

2 个答案:

答案 0 :(得分:0)

您可以使用jQuery css()方法读取元素的任何css属性,然后再次设置属性。

https://api.jquery.com/css/

获得:

var theColor = $('.myElement').css("color");

环境:

$('.myElement').css("color", "newColor");

答案 1 :(得分:0)

要使用任何jQuery的功能(如CSS),您需要等待DOM加载,当您的浏览器完成加载HTML并将元素渲染为100%时。

您必须使用jQuery的选择器规则来查找DOM-Nodes,它表示作为对象找到的元素。有了节点,您可以使用它。

您必须执行以下操作:

// Wait for DOM load
$(document).ready(function() {

    // Getting element by ID and it's color
    var color = $("#my_element_ID").css("color");

    // Setting a color to a group of elements within some rule..
    $("#container div.some_class").css("color", "#FF0000");
});

更多关于jQuery" .ready()"功能官方文档: https://api.jquery.com/ready/

有关CSS文档的更多信息: https://api.jquery.com/css/

有关选择器文档的更多信息: https://api.jquery.com/category/selectors/