CSS选择器优先级问题

Question

我有一个类似于：

的选择器

div#content > section (.left > img) + .left

但很明显，括号会被忽略。我该怎么改写这个？或者在纯CSS中是不可能的？

Answer 1

不，你不能根据它包含的内容在CSS中选择一些内容，这基本上就是你在括号中尝试的内容。

It's best explained by this question on SO.

Answer 2

至少在最新的css3规范中，您尝试做的事情是不可能的。

如果您不想通过服务器添加，可能还有点jQuery？

看到这个小提琴，因为它很容易做到你想要的

http://jsfiddle.net/4qZpc/2/embedded/result/ - 结果！

抓住代码： http://jsfiddle.net/4qZpc/2/

Answer 3

如何为该部分提供一个id（假设您有多个部分），然后执行以下操作：

#content-section img + .left

我不完全确定你在这里想要达到什么效果，但是如果没有特定的情况，.left元素直接跟在img以外的地方，那么你应该是安全的。

或者，如果你有嵌套的.left元素，你可以这样做：

#content-section img + .inner-left

Answer 4

如果包含img元素，则必须在.image_in_it类的每个元素上添加服务器端.left类。

<div id="content">
    <section>
        <div class="left image_in_it">
            <img src="" alt="">
        </div>
        <div class="left">
        </div>
    </section>
</div>

然后div#content > section > .left.image_in_it + .left会在.left

之后直接选择任何.left.image_in_it