HTML CSS ausblenden alle außer letzte Element

Question

Ich bin Tring alle elemnts in einem div mit Ausnahme des letzten zu verstecken, hier ist mein HTML-Code:

<div id="TOPsession"> 
    <a id="link1" href="exc.txt"> 
     <img src="imagens/header/exc.png" align="center"> 
      <label id="label1">Label</label> 
    </a> 

    <a href="#" id="session">Session</a> 
    <label id="lbar" style="color: #666;">|</label> 
    <select id="sel"> 
     <option>German</option> 
     <option>Ingles</option> 
    </select> 
</div> 

ich auf Web durchsucht, und ich finde diesen CSS-Code alles ausblenden bis auf das letzte Element:

Aber das verstecken alle Elemente, jemand weiß, was ich falsch mache? Danke für die Hilfe.

Answer 1

Sie können #TOPsession > *:not(:last-child) verwenden, dies wird alle direkten Kinder von TOPsession außer :last-child auswählen.

---

Wenn Sie nicht > verwenden Sie werden auch alle Elemente innerhalb letzte Element außer letzte Element innerhalb letzte Element Versuchen DEMO

#TOPsession > *:not(:last-child) { 
 
    visibility: hidden; 
 
}

<div id="TOPsession"> 
 
    <a id="link1" href="exc.txt"> 
 
    <img src="imagens/header/exc.png" align="center"> 
 
    <label id="label1">Label</label> 
 
    </a> 
 

 
    <a href="#" id="session">Session</a> 
 
    <label id="lbar" style="color: #666;">|</label> 
 
    <select id="sel"> 
 
    <option>German</option> 
 
    <option>Ingles</option> 
 
    </select> 
 
</div>