Javascript 悬停在父元素上，但不影响子元素

我试图在悬停父div元素时变暗，该元素内部有一个段落标记（这是子元素）。当鼠标悬停时，元素会受到父元素变暗的影响，字体的颜色也会变暗，这不是我想要达到的效果（默认情况下，元素的颜色应该是明亮的）

.parent{
背景颜色：浅灰色
}
.家长：悬停{
过滤器：亮度（50%）；//这也影响子元素
}

段落

要仅影响孩子，可以执行以下操作：

.parent, .children {
  background:white;
} 
.parent:hover {
  background: black; //this affects the parent and the child
}
.parent:hover .children {
  background: white; //this affects only child
}

因此，您所做的是覆盖子对象悬停，因此就像您排除子对象一样。

---

所以发生的情况是，两者都是白色的，您将鼠标悬停在父对象上，它们都变为黑色，但立即被

覆盖。父对象：hover.children

使子对象保持白色

你不能！仅单独的元素过滤器影响整个元素，包括其子元素。只需使用较深的蓝色阴影即可。您不能使用fiter和不透明来影响内部的所有内容。您是否有更详细的示例，因为对于您尝试使用filter属性实现的内容，可能有其他解决方案。这对filter css属性不起作用。