1

我有一个带有倾斜(标签)的tabContainer,我需要实现的是当单击一个选项卡时,我希望将颜色更改为红色或任何处于活动状态的含义,而剩余的非活动选项卡可能保持黑色作为默认颜色。我试过在网上搜索,我看到的唯一解决方案是带有 class .tabLabel{color: Red;} 的 css,它将所有选项卡标题更改为红色,还尝试了 onShow 事件,它可以响应警报事件但不能响应样式表。此外,如果您在 tabcontainer 中有 id 并使用 dojo javascript 应用 css,它会更改选项卡中的内容而不是标题。这是我从 dojo 获得的示例代码,以显示我想要实现的目标。

    <!DOCTYPE html>
<html >
<head>

    <link rel="stylesheet" href="../../_static/js/dojo/../dijit/themes/claro/claro.css">

<script>dojoConfig = {parseOnLoad: true}</script><script src='../../_static/js/dojo/dojo.js'></script><script>require(["dojo/parser", "dijit/layout/TabContainer", "dijit/layout/ContentPane"]);</script>
</head>
<body class="claro">
    <div style="width: 350px; height: 300px">
    <div data-dojo-type="dijit/layout/TabContainer" style="width: 100%; height: 100%;">
        <div data-dojo-type="dijit/layout/ContentPane" title="My first tab" data-dojo-props="selected:true">
            Lorem ipsum and all around...
        </div>
        <div data-dojo-type="dijit/layout/ContentPane" title="My second tab">
            Lorem ipsum and all around - second...
        </div>
        <div data-dojo-type="dijit/layout/ContentPane" title="My last tab" data-dojo-props="closable:true">
            Lorem ipsum and all around - last...
        </div>
    </div>
</div>
</body>
</html>

从上面的代码中,我想使用不同颜色的文本和其他选项卡以默认颜色激活 title="My first tab",当单击我的第二​​个选项卡时使其激活并执行与第一种菜单相同的操作网站上的链接。请帮忙。谢谢

4

1 回答 1

2

您可以通过添加此类来更改活动选项卡的文本颜色。

.dijitChecked.dijitTab .tabLabel {
    color:red;
}

这是一个例子。

于 2012-11-27T06:15:14.480 回答