代码之家  ›  专栏  ›  技术社区  ›  Arlen Beiler

如果一个元素*没有某个类,我该如何应用CSS?

  •  -2
  • Arlen Beiler  · 技术社区  · 13 年前

    我在一个div中有一系列的div。我想将一个css规则应用于所有这些div,然后使用类将另一个css规则应用于其中一个div。这是我目前的风格:

    .singleTiddler div { display:none; }
    .singleTiddler div.singleTiddlervisible { display:block; }
    

    Chrome的问题在于,它在检查器中显示为使用display:block,但什么也没有显示。有趣的是,当我在检查员处悬停在它上面时,它就在那里,但没有高度。

    <div id="tiddlerDisplay" class="singleTiddler">
        <div class="singleTiddlervisible">
            <div>Hi</div><div>There</div><div>We</div>
            <div>Like</div><div>Divs</div>
        </div>
        <div>
            <div>Hi</div><div>There</div><div>We</div>
            <div>Like</div><div>Divs</div>
        </div>
        <div>
            <div>Hi</div><div>There</div><div>We</div>
            <div>Like</div><div>Divs</div>
        </div>
    </div>
    
    1 回复  |  直到 13 年前
        1
  •  0
  •   BoltClock    13 年前

    一个主要问题是 .singleTiddler div 将适用于所有级别的所有div。如果下面有div,它们也将被隐藏。重写css将仅应用于具有类的div singleTiddlervisible ,因此只显示根div。请改用子选择器:

    .singleTiddler > div { display:none; }
    .singleTiddler > div.singleTiddlervisible { display:block; }