javascript - 祖父母的 CSS 目标

Question

在这个JSFiddle示例中，仅使用 CSS，当元素获取属性.child时可以定位/样式化元素吗？就像是：.secondChildfocused="true"

.grandParent [focused="true"] ...?

这是我的 HTML：

<div class="grandParent">
    <div class="parent">
        <div class="child"></div>
    </div>
    <div class="parent sibling">
        <textarea class="secondChild"></textarea>
    </div>
</div>

还有我当前的 CSS：

.grandParent {
    padding: 20px;
    background: red;
}
.parent {
    padding: 20px;
    background: blue
}
.child {
    padding: 20px;
    background: green;
}
.secondChild {
    padding: 20px;
    background: grey;
}
.sibling {
    padding: 20px;
    background: orange;
}

Answer 1

也许你可以尝试这样的事情：http: //jsfiddle.net/JTUKC/1/

真诚地，我不知道为什么这些选择器不起作用

div.grandParent div.parent textarea.secondChild:hover + div.grandParent div.parent div.child {
    background: pink !important;
}