css - CSS过渡：在孩子悬停时为父母设置动画

Question

通常，我会选择父级并添加一个悬停伪类：

parent {
    opacity: 0.7;
    transition-duration: .2s;
}

parent:hover {
    opacity: 1;
}

但是有太多不同的父元素，带有不同的标签和类。我只知道每个父母都有独生子女的[color]属性。

(parent "which have" > [color]) {
    opacity: 0.7;
    transition-duration: .2s;
}

(parent "which have" > [color]):hover {
    opacity: 1;
}

CSS3中是否有类似父选择器的东西（CSS4：'！'）？还是有另一种方法可以让父母在孩子悬停时设置动画？

感谢帮助

Answer 1

您的问题有点模棱两可，但让我猜猜您的意思并尝试为您提供解决方案；

您有颜色 attr 的父 div 元素（假设它是红色），并且您希望它的子元素具有悬停状态的样式。

div[style~='color:red']>p:hover{
 //your code goes here
}

但是您的颜色必须定义为内联样式，否则您需要查看其他属性，例如数据属性 data-selparent='yes'。