CSS "et" et "ou"

Question

J'ai un gros problème, car j'ai besoin d'anathématiser le stylisme de certains types d'entrée. J'avais quelque chose comme :

.registration_form_right input:not([type="radio")
{
 //Nah.
}

Mais je ne veux pas styliser les cases à cocher également.

J'ai essayé :

.registration_form_right input:not([type="radio" && type="checkbox"])
.registration_form_right input:not([type="radio" && "checkbox"])
.registration_form_right input:not([type="radio") && .registration_form_right input:not(type="checkbox"])

Comment l'utiliser && ? Et j'aurai besoin d'utiliser || bientôt, et je pense que l'usage sera le même.

Mise à jour :
Je ne sais toujours pas comment utiliser || y && correctement. Je n'ai rien trouvé dans la documentation de W3.

Answer 1

Vous pouvez en quelque sorte reproduire le comportement de "OR" en utilisant & et :not.

SomeElement.SomeClass [data-statement="things are getting more complex"]  :not(:not(A):not(B))     {
    /* things aren't so complex for A or B */
}

Answer 2

Je suppose que vous détestez écrire plus de sélecteurs et les diviser par une virgule ?

.registration_form_right input:not([type="radio"]),  
.registration_form_right input:not([type="checkbox"])  
{  
}

et BTW ceci

not([type="radio" && type="checkbox"])  

me semble plutôt être "entrée qui n'a pas ces deux types" :)

Answer 3

Une mise en garde s'impose. L'enchaînement de plusieurs not augmente la spécificité du sélecteur résultant, ce qui le rend plus difficile à remplacer : vous devrez essentiellement trouver le sélecteur avec tous les "not" et le copier-coller dans votre nouveau sélecteur.

A not(X or Y) serait parfait pour éviter de gonfler la spécificité, mais je suppose que nous devrons nous contenter de combiner les opposés, comme dans cette réponse .

Answer 4

Si nous voulons rechercher un div qui contient à la fois cette ET que dans leur value nous pouvons simplement relier les deux conditions, comme suit :

div[value*="this"][value*="that"] 

Au cas où nous voudrions que le div qui contient soit cette OU que vous pouvez utiliser une virgule entre les deux conditions, comme suit :

div[value*="this"], div[value*="that"] 

Note : Vous pouvez utiliser autant de conditions que vous le souhaitez. Cela n'est en aucun cas limité à 2 comme indiqué dans l'exemple.