选择一个没有特定类的子元素的元素

Question

我的 HTML 的结构是这样的

<div>
    <div>
        <h1>Something</h1>
    </div>
    <div>
        <h1 class='Handle'>Something</h1>
    </div>
</div>

在事件中div > div没有与类的“把手”我想要的孩子div > div有风格cursor:move;。我将如何在纯 CSS 中执行此操作，甚至可能吗？

Answer 1

目前没有浏览器支持这个

这会起作用，但据我所知，目前没有浏览器支持它。然而，jQuery 确实如此。

div > div:not(:has(h1.Handle)) {
    cursor: move;
}

Answer 2

CSS 中没有父选择器，所以你所要求的是不可能的。您可以做的是cursor:move使用属性选择器将 放在每个不具有“Handle”类的 h1 上。

h1:not([class=Handle]) {
    cursor:move;
} 

http://jsfiddle.net/4HLGF/

另一种选择是调整 HTML，并将 h1 移动到与 div 相同的水平。

<div>
    <h1>Something</h1>
    <div>
        dragable content
    </div>
    <h1 class='Handle'>Something</h1>
    <div>
        non dragable content
    </div>
</div>

现在您可以对 h1 进行相同的检查，并定位其后面的 div。

h1:not([class=Handle]) + div {
    cursor:move;
}

http://jsfiddle.net/4HLGF/2/