sélecteur css pour faire correspondre un élément sans attribut x

Question

Je travaille sur un fichier CSS et trouve le besoin de styler des zones de saisie de texte, cependant, je rencontre des problèmes. J'ai besoin d'une simple déclaration qui correspond à tous ces éléments:

<input /> 
<input type='text' /> 
<input type='password' /> 

... mais ne correspond pas à celles-ci:

<input type='submit' /> 
<input type='button' /> 
<input type='image' /> 
<input type='file' /> 
<input type='checkbox' /> 
<input type='radio' /> 
<input type='reset' /> 

Voici ce que je voudrais faire:

input[!type], input[type='text'], input[type='password'] { 
    /* styles here */ 
} 

Dans le CSS ci-dessus, notez que le premier sélecteur est input[!type]. Ce que je veux dire par là, c'est que je veux sélectionner toutes les boîtes de saisie où l'attribut type n'est pas spécifié (parce que c'est par défaut le texte, mais input[type='text'] ne correspond pas). Malheureusement, il n'y a pas un tel sélecteur dans la spécification CSS3 que j'ai pu trouver.

Est-ce que quelqu'un connaît un moyen d'accomplir cela?

Answer 1

: non sélecteur

input:not([type]), input[type='text'], input[type='password'] { 
    /* style here */ 
} 

Support: dans Internet Explorer 9 et plus

Answer 2

Pour une solution plus cross-browser, vous pouvez le style tous Entrées la façon dont vous voulez que le non typé, texte, et mot de passe puis un autre style le remplace ce style pour les radios, cases à cocher, etc

input { border:solid 1px red; } 

input[type=radio], 
input[type=checkbox], 
input[type=submit], 
input[type=reset], 
input[type=file] 
     { border:none; } 

- Ou -

pourrait ne importe quelle partie de votre code qui génère les entrées non typé leur donner une classe comme .no-type ou tout simplement pas sortie du tout? De plus, ce type de sélection pourrait être fait avec jQuery.

Answer 3

Je voulais juste ajouter à cela, vous pouvez avoir le: non sélecteur Oldie en utilisant selectivizr: http://selectivizr.com/