为什么这个链接：没有选择不工作？ [重复](Why does this chained :not

This question already has an answer here:

• Chained :not selector does not working for child div 2 answers

I have a child div which has been effected by .img class.

Although I insert :not selector for this div as

.main .content .index-exp .img:not(#view-image):not(.view-image){ /*rest*/ }

it is still effecting my div and this hurts my brain.

If I remove :not(#view-image) it is working as expected,

but as .img:not(#view-image):not(.view-image) chained not working.

I know that this kind of usage is true.

What could be problem.

Here is http://jsfiddle.net/x80vm7y8/6/ address.

My result

Expected result is

<div class="main">
    <div class="content">
    <div class="index-exp">
<div class="container">
<div class="viewers">
    <div class="product-exp">
        <div class="view-exp">      
            <div class="content">
                <div class="inquiry-form">
                    <form action="http://akasiayachting.com/wp-content/themes/active3/php/get_sendmail/get_sendmail.php" method="post" name="inquiry-form">
                        <div>
                            <span class="img"><img class="view-image" id="captcha" src="http://akasiayachting.com/wp-content/themes/active3/php/get_captcha/get_captcha.php" /></span>
                            <span class="img"><img class="view-image" id="code-refresh" src="http://akasiayachting.com/wp-content/themes/active3/views/active-71-detail/images/form-icon-refresh.png" /></span>
                            <input name="code-verification" type="text" class="code-verification" value="Security Code" />
                            <input name="submit" type="submit" value="Send Inquiry" />
                        </div>
                    </form><!-- #form -->
                </div><!-- #inquiry-form -->
            </div><!-- #content -->
        </div><!-- #view-exp -->
    </div><!-- #product-exp -->
    </div><!-- #viewers -->    
</div><!-- #container -->
</div>
</div>
</div>

Answer 1:

我认为这个问题是ID，当你给它一个:not(#xxx)它使选择更加专一，这时它会覆盖从以前定义这就是为什么你看到了错误的风格样式。 一旦你删除它，它的作品，因为以前定义的风格更加具体。

您可以使用检查行动中看到这一点，就说明被应用有和没有标识的样式（删除ID部分，并重新运行）

这是你想要的定义

.viewers .product-exp .view-exp .content .inquiry-form div span.img

但是当你添加了ID，线路69和应用将覆盖。

做最简单的事情就是一个类添加到#view-image元素和目标not那个类，像

.main .content .index-exp .img:not(.new_class):not(.view-image){ /*rest*/ }

文章来源: Why does this chained :not selector not work? [duplicate]