Question Existe-t-il un sélecteur CSS pour les éléments sans attribut href?


Je comprends que les règles CSS peuvent cibler des éléments spécifiés par des valeurs d'attribut, par exemple:

input[type="text"] {}

Puis-je faire une règle qui cible les éléments qui omettre un certain attribut? Par exemple, puis-je cibler des éléments sans href ou des éléments ne spécifiant pas de type?


36
2017-08-23 19:10


origine


Réponses:


Vous pouvez suivre ce modèle:

a:not([href])
input:not([type])

le sélecteur d'attribut est utilisé pour sélectionner des éléments avec l'attribut spécifié.

:not est pris en charge dans tous les navigateurs modernes et IE9 +, si vous avez besoin d’un support IE8 ou inférieur, vous n’avez pas de chance.


66
2017-08-23 19:14



Pour les liens, vous pouvez simplement utiliser:

a { color: red; }
a:link { color: green; }

violon: http://jsfiddle.net/ZHTXS/ pas besoin de javascript.

Pour les attributs de formulaire, utilisez le modèle d’attribut not ci-dessus input:not([type]) et si vous avez besoin de prendre en charge d'anciennes versions d'IE, j'ajouterais probablement une classe et utiliserais une feuille de style spécifique à IE associée à des commentaires conditionnels.


1
2017-08-23 19:17



Vous pouvez toujours définir un style différent pour a et href

Vérifie ça: http://jsfiddle.net/uy2sj/


1
2017-08-23 19:18



Réponse simple pour celui-ci.

Non.

Vous pouvez le faire via JavaScript si vous voulez que je fournisse cette solution?

Cependant, le CSS Hack

(Cependant, il y a une façon "hacky" à laquelle je pensais juste pour CSS).

Prends ce scénario ... tu en veux <a> les balises qui n'ont pas de href doivent être colorées en rouge.

Par exemple, vous pouvez supposer que les seuls attributs que vous conserverez seront:

  • alt
  • Titre
  • href
  • cible etc

Ce que vous pourrait do, crée une règle globale pour la balise d'ancrage. Par exemple

a {
 color: red;
}

Ensuite, il vous suffit de créer une règle qui remplacera cette règle globale après cette déclaration pour chacun des attributs attendus.

Donc, vous auriez

a[href] {
  color: blue;
}

Maintenant, vous saurez que toute balise qui manque le href sera rouge.

La question initiale posée,

Puis-je créer une règle qui cible les éléments qui omettent un certain attribut?

Et non tu ne peux pas! Il n'y a pas de navigateur croisé, façon de ciblage / sélectionner des éléments qui omettent un attribut en utilisant CSS. D'où je pense que la solution que j'ai proposée est un hack, car elle va à l'encontre du but recherché.


-3
2017-08-23 19:13