Sélecteur CSS pour <type d'entrée = "?"

Est-il possible avec CSS de cibler toutes les entrées en fonction de leur type? J’ai une classe désactivée que j’utilise sur divers éléments de formulaire désactivés et je règle la couleur d’arrière-plan pour les zones de texte, mais je ne veux pas que mes cases obtiennent cette couleur.

Je sais que je peux le faire avec des cours séparés mais je préfère utiliser CSS si possible. Je suis sûr que je peux définir cela en javascript, mais encore une fois pour CSS.

Je cible IE7 +. Donc je ne pense pas pouvoir utiliser CSS3.

modifier

Avec CSS3, je pourrais faire quelque chose comme ça?

INPUT[type='text']:disabled qui serait encore mieux débarrasser de ma classe tout à fait …

modifier

OK, merci pour le coup de main! Alors, voici un sélecteur qui modifie toutes les zones de texte et les zones désactivées sans avoir à définir de classes. Lorsque j’ai commencé cette question, je n’aurais jamais pensé que c’était possible …

 INPUT[disabled][type='text'], TEXTAREA[disabled] { background-color: Silver; } 

Cela fonctionne dans IE7

Oui. IE7 + prend en charge les sélecteurs d’atsortingbuts:

 input[type=radio] input[type^=ra] input[type*=d] input[type$=io] 

Élément saisi avec un type d’atsortingbut qui contient une valeur égale à, commence par, contient ou se termine par une certaine valeur.

Les autres sélecteurs sûrs (IE7 +) sont les suivants:

  • Parent> enfant qui a: p > span { font-weight: bold; } p > span { font-weight: bold; }
  • Précédé par ~ élément qui est: span ~ span { color: blue; } span ~ span { color: blue; }

Ce qui pour

vous donnerait effectivement:

 

Lectures complémentaires: compatibilité CSS du navigateur sur quirksmode.com

Je suis surpris que tout le monde pense que cela ne peut pas être fait. Les sélecteurs d’atsortingbuts CSS sont déjà présents depuis un certain temps. Je suppose qu’il est temps de nettoyer nos fichiers .css.

Malheureusement, les autres affiches ont raison de dire que vous êtes en fait corrigé par kRON, vous êtes d’accord avec votre IE7 et une doc ssortingcte, mais la plupart d’entre nous ayant des exigences IE6 sont réduites à JS ou à des références de classe. une propriété CSS2, une seule sans prise en charge suffisante des navigateurs IE ^ h ^ h.

Par souci de complétude, le sélecteur de type est similaire à xpath de la forme [atsortingbute=value] mais de nombreuses variantes intéressantes existent. Il sera assez puissant quand il sera disponible, bonne chose à garder dans votre tête pour IE8.

  • w3 référence

  • Référence de support du navigateur

Vous pouvez le faire avec jQuery. En utilisant leurs sélecteurs, vous pouvez sélectionner par atsortingbuts, tels que le type. Cela nécessite toutefois que vos utilisateurs aient activé Javascript et un fichier supplémentaire à télécharger, mais si cela fonctionne …

Désolé, la réponse courte est non. CSS (2.1) ne marquera que les éléments d’un DOM, pas leurs atsortingbuts. Vous devrez appliquer une classe spécifique à chaque entrée.

Dommage, je sais, car ce serait incroyablement utile.

Je sais que vous avez dit préférer CSS à JavaScript, mais vous devriez quand même envisager d’utiliser jQuery. Il offre un moyen très propre et élégant d’append des styles aux éléments DOM en fonction des atsortingbuts.