Consideremos el siguiente código HTML:CSS ningún selector de hermanos
<div>
<div class="iwant" />
<div class="idontwant" />
</div>
<div>
<div class="iwant" />
</div>
estoy interesado en un selector (para el rastreo de contenido, así que no puedo modificar el HTML) que seleccionaría todos iwant que no tienen un hermano con clase idontwant.
No hay selector de hermanos para unir los elementos (o no) por clase.
El selector más cercano que puedo pensar es
.iwant:only-child
Pero este selector significa que no puede haber ningún otro elemento aparte de que div class="iwant" como hijos del padre div, independientemente del tipo o clase. Esto puede satisfacer su necesidad dependiendo de la estructura de su HTML, así que vale la pena intentarlo. Sin embargo, si los nombres de clase son un problema para usted, probablemente no haya mucha solución, porque no hay una pseudoclase :only-of-class en CSS que filtre por clase e ignore el resto.
No hay selector CSS de hermanos negativos. Utilice el selector de hermanos para establecer nuevos estilos, a continuación, restaurar los estilos en el .idontwant:
div.iwant {
/*Set CSS here*/
display: inline;
}
div.iwant ~ div.idontwant {
/*Reset CSS*/
display: block /* Default of DIV is block*/
}
Eso es redundante ya que cada clase es mutuamente exclusiva. – BoltClock
@BoltClock ¿Qué quieres decir con eso? El selector 'div.iwant ~ div.idontwant' es más específico que' div.iwant'. –
No estoy configurando estilos, quiero obtener esos elementos para rastreador y preferiría hacerlo en una consulta. –
No hay una buena manera de dirigirse a un elemento sin un elemento de hermanos específica. Pero puede usar .iwant:last-child para orientar elementos que no tengan un hermano posterior.
Podría ser una solución, pero yo prefiero algo más general porque puede haber adicionales 'div's. Buena idea sin embargo. –