Javascript 如何在树节点CSS上显示全宽背景色

我已经创建了一棵树，树节点悬停时背景颜色发生了变化。我想显示

背景色

，如中所示（单击任何显示灰色的节点）

但是我正在应用

背景色的元素本身并不是全宽的。我怎样才能做到这一点


.qwc-tree\u分支{
左侧填充：40px！重要；
字体大小：12px；
}
.树根{
左侧填充：0！重要；
}
.tree\u节点{
列表样式类型：无；
保证金：0；
左侧填充：5px；
职位：相对
}
.tree__节点：：之前，
.tree\u节点：：之后{
内容：''；
左：-20px；
位置：绝对位置；
右：自动
}
.tree\u节点：：之前{
左边框：1px点#e0；
底部：50px；
身高：100%；
排名：0；
宽度：1px
}
.tree\u节点：：之后{
边框顶部：1px虚线#e0；
高度：20px；
顶部：15px；
宽度：25px
}
.tree\uuuu root>.tree\uuuu root-node:：before{
边界：0；
}
.tree\uuuu root>.tree\uuuu root-node:：after{
边界：0；
}
.tree__节点头：悬停{
背景颜色：浅蓝色；
}
.tree\u节点名称{
显示：内联flex；
对齐项目：居中；
填充：3px8px；
文本装饰：无
}
.tree\u节点名称--图标{
利润率：0.5px 0.3px；
颜色：$primary；
}
.tree\u节点操作{
光标：指针；
浮动：对；
右边距：15px
}
tree.tree\u节点：最后一个子节点：：之前{
高度：30px
}



派遣印度
减少


旁遮普省


哈里亚纳邦



您可以使用伪元素模拟背景并使其溢出：

.tree__node-header:after {
  content:"";
  position:absolute;
  top:0;
  left:-40px; /*adjust this*/
  right:0;
  bottom:0;
  z-index:-1;
}

完整代码：


.qwc-tree\u分支{
左侧填充：40px！重要；
字体大小：12px；
}
.树根{
左侧填充：0！重要；
}
/*加上这个*/
.tree\uuu root>.tree\uuu root-node>.tree\uuuu node-header{
溢出：隐藏；
}
/**/
.tree\u节点{
列表样式类型：无；
保证金：0；
左侧填充：5px；
职位：相对
}
.tree__节点：：之前，
.tree\u节点：：之后{
内容：''；
左：-20px；
位置：绝对位置；
右：自动
}
.tree\u节点：：之前{
左边框：1px点#e0；
底部：50px；
身高：100%；
排名：0；
宽度：1px
}
.tree\u节点：：之后{
边框顶部：1px虚线#e0；
高度：20px；
顶部：15px；
宽度：25px
}
.tree\uuuu root>.tree\uuuu root-node:：before{
边界：0；
}
.tree\uuuu root>.tree\uuuu root-node:：after{
边界：0；
}
.tree__节点头：悬停，
.tree__node-header:hover:在{/*添加此*/
背景颜色：浅蓝色；
}
/*加上这个*/
.tree\u节点头{
位置：相对位置；
}
.tree__节点头：之后{
内容：“；
位置：绝对位置；
排名：0；
左：-45px；
右：0；
底部：0；
z指数：-1；
}
/* */
.tree\u节点名称{
显示：内联flex；
对齐项目：居中；
填充：3px8px；
文本装饰：无
}
.tree\u节点名称--图标{
利润率：0.5px 0.3px；
颜色：$primary；
}
.tree\u节点操作{
光标：指针；
浮动：对；
右边距：15px
}
tree.tree\u节点：最后一个子节点：：之前{
高度：30px
}



派遣印度
减少


旁遮普省


哈里亚纳邦



在我的机器上工作正常。任何特定的浏览器设备都不工作？@NanditaAroraSharma我在示例代码段中看到了浏览器上的问题。我认为OP的意思是，highlight没有覆盖子列表元素的整行（它从子列表开始的地方开始），谢谢@ChiragRavindra的解释谢谢！！但对于根元素，它也得到了扩展，我希望在背景宽度方面保持相同的大小？@SunilGarg检查更新；）我们只需要把溢出：隐藏在正确的地方你能评论一下你做了什么改变吗？这只适用于2级。如果有多个级别，它的行为应该是相同的，不是吗？@SunilGarg是的，它可以，您只需使用
left
属性和overflow，这里我使用了一个固定值，您需要为下一个级别设置更大的值