Question

当标签处于活动状态和非活动状态时，我尝试更改dijit布局tabcontainer的标题文字颜色。

有没有人知道tabcontainer标题颜色的css属性名称是什么，或者我可能会在哪里找到它们？

我正在使用dojo版本1.12

由于

皮特

Answer 1

如果要在tab的活动状态下设置颜色，可以使用.tabLabel css类更改tabcontainer的文本颜色，只需查看.dijitTabChecked .tabLabel。

见下面的工作片段：

require([
	"dojo/query",
  "dojo/on",
	"dojo/dom-style",
  "dijit/layout/TabContainer", 
  "dijit/layout/ContentPane",
  "dojo/domReady!"
], function(query,On,domStyle,TabContainer,ContentPane) {
  
  var tc = new TabContainer({
    style: "height: 100px; width: 100%;"
  },"tabContainer");

  var cpOrg = new ContentPane({
       title: "Tabe one",
       content: "Content of tab 1"
  });
  
  tc.addChild(cpOrg);
	
  var cpShared = new ContentPane({
       title: "Tabe two",
       content: "Content of tab 2"
  });
  tc.addChild(cpShared);

  var cpPrivate = new ContentPane({
       title: "Tabe three",
       content: "Content of tab 3"
  });
  
  tc.addChild(cpPrivate);
  tc.startup();
 
  
  
});

#tabContainer .tabLabel {
  color:green;
  
}

#tabContainer .dijitTabChecked .tabLabel {
  color:red;
  font-weight:bold;
}

<script src="https://ajax.googleapis.com/ajax/libs/dojo/1.11.2/dojo/dojo.js"></script>
<link href="https://ajax.googleapis.com/ajax/libs/dojo/1.10.0/dijit/themes/claro/claro.css" rel="stylesheet"/>
<div class="claro">
  <div id="tabContainer"></div>
</div>

更改dijit布局tabcontainer的选项卡颜色

1 个答案: