2012-01-09 1 views
7

Come seleziono le immagini in questo documento che non si trovano all'interno di un elemento con una classe .todeep? Nel caso in cui il secondo e il terzo elemento dovrebbero essere selezionati. Non so quanto saranno profonde le immagini dopo un elemento "todeep".Selettore CSS, non è un discendente di

<body> 
    <div class="todeep"> 
     <img> 
    </div> 
    <div> 
     <img> 
     <div> 
      <img> 
      <div class="todeep"> 
       <img> 
       <div> 
        <img /> 
       </div> 
      </div> 
     </div> 
    </div> 
</body> 

ho pensato a una soluzione semplice: *: Non img (.todeep), ma questo sarà anche selezionare le immagini che hanno un elemento non "todeep" tra i loro antenati anche.

+0

possibile duplicato del [selettori CSS Negative] (http://stackoverflow.com/ questions/726493/negative-css-selectors) – Neil

risposta

4

Sarà necessario selezionare tutte le immagini e quindi annullare quelle che hanno un genitore .todeep.

Così, invece di

img { background-color: blue; width: 20px; height: 20px; } 
*:not(.todeep) img { background-color: red; } 

uso

img { background-color: red; width: 20px; height: 20px; } 
.todeep img { background-color: blue; } 

(codice di esempio preso in prestito da Te di jsfiddle)

+0

Questo è solo per i bambini 'img', non discendenti a nessun livello. Sostituisci il selettore di bambini con il selettore discendente. – BoltClock

+0

@BoltClock: hai ragione, risolto. – Bergi