Combiner les attributs CSS et les sélecteurs de Pseudo-éléments?
Comment puis-je combiner un sélecteur de pseudo-éléments ( :after ) avec un sélecteur d'attribut ( [title] )?
j'ai essayé d'utiliser div[title]:after , mais cela ne fonctionne pas dans le Chrome.
HTML:
<div title="foo">This div has a title.</div>
<div>This div does not have a title.</div>
CSS:
div:after {
content: "NO";
}
div[title]:after {
content: "YES";
}
Démo: http://jsfiddle.net/jmAX6 /
il me montre "oui" à la fin de chacun de ces div's, quand il devrait montrer " Non" après la deuxième div.
J'exécute Chrome 17.0.963.38. Il semble fonctionner très bien dans Safari 5.1.2.
1 réponses
cela ressemble à un bug, qui a finalement été rapporté . Si vous ajoutez une règle CSS pour div[title] n'importe où dans votre feuille de style avec au moins une déclaration, votre règle div[title]:after s'appliquera comme par magie. Par exemple:
div:after {
content: "NO";
}
div[title] {
display: block;
}
div[title]:after {
content: "YES";
}
Voir la mise à jour du violon .
Il semble aussi avoir quelque chose à faire avec votre deuxième div avoir ou ne pas avoir certains Attributs HTML, comme indiqué dans les commentaires ci-dessous.