`

extjs中TreeNode改变图标

CSS 
阅读更多

尝试着用iconCls属性定义TreeNode的图标样式,结果不行

iconCls:'icon-new'

 

.icon-new {
	background-image: url(../extjs/icons/new.png);
}

然后尝试使用icon定义图标样式,结果没有问题,可是还是比较习惯使用css定义,查到extjs的的解决方案,使用iconCls定义样式时一定要用css的层叠写法才能正确显示,也就是

.x-tree-node .icon-new{background-image: url(../extjs/icons/new.png)}  

 

以上是不考虑节点状态,如果需要考虑到节点的展开与关闭,则代码如下

/*为节点的开闭状态和叶节点状态分别设置样式*/  
.x-tree-node-expanded  .your-iconCls{background-image: url(youricon.gif)}  
.x-tree-node-collapsed  .your-iconCls{background-image: url(youricon2.gif)}  
.x-tree-node-leaf  .your-iconCls{background-image: url(youricon3.gif)}  

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics