dojo tabContainer 标题（标签）答案

【问题标题】：dojo tabContainer title(label)dojo tabContainer 标题（标签）
【发布时间】：2012-11-14 13:50:03
【问题描述】：

我有一个带有倾斜（标签）的 tabContainer，我需要实现的是当单击一个选项卡时，我希望将颜色更改为红色或任何处于活动状态的含义，而剩余的非活动选项卡可能保持黑色，默认颜色.我试过在网上搜索，我看到的唯一解决方案是带有类 .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" 激活，使用不同颜色的文本和其他默认颜色的选项卡，当我的第二个选项卡被点击时，使其激活并执行与第一个相同的操作网站上的一种菜单链接。请帮忙。谢谢

【问题讨论】：

标签： dojo title tabcontainer

【解决方案1】：

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

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

Here is an example.

【讨论】：

也谢谢我把标题的内容放在一个跨度中然后在我能够使用onShow事件添加css类的跨度内应用id。