Pseudo sélecteur et attribut data

Existe-t-il un moyen en css de sélectionner selon un data attribute ? ou un attribut perso ?

Un exemple rapide pour l'idée :

Code:

---

1 2	<div data-flag="0"> caché </div> <div data-flag="1"> visible </div>

---

Code:

---

1 2	:[data-flag="0"] {display:none;}

---

:oops:
Désole, emporté par mon habitude de la syntaxe Jquery j'aivais mis ":" ...
sans ça marche beaucoup mieux ...

Code:

---

[data-flag="0"] {display:none;}

---

Bon j'avance ...

Pour le not on fait comment ?
http://fiddle.jshell.net/wkg77nbj/8/

le flag 6 ne devrait pas être vert.. ??

Salut,

Presque : http://fiddle.jshell.net/wkg77nbj/9/

Une demo est dispo dans cette page : http://debray-jerome.developpez.com/...s-en-css3/#LVI

Curieux, pourquoi cela fonctionne-t-il à moitié sans préciser div avant ?

et pourquoi cela ne fonctionne-t-il pas avec

Code:

---

*:not([data-flag="6"]){ color: green;}

---

Je ne sais pas ce qu'il se passe derrière mais sûrement que la "fonction" not() a besoin d'un sélecteur précis.

* doit être trop général. Quand a ne rien mettre, cela est vraisemblablement bancal.

Pour ma part, j'ai toujours mis un sélecteur devant les pseudo-classes ou éléments.

Ok !
Merci :P pour ces éclaircissements, je serai plus rigoureux a l'avenir dans mes déclarations de sélectuers pour le css !

Bonjour,
:not est une pseudo-class au même titre que :hover et il ne viendrait à personne l'idée d'écrire

Code:

---

1 2 3 4

:hover { font-weight:bold; color:red; }

---

dans la spécification on retrouve d'ailleurs

E:not(s)

an E element that does not match simple selector s

Negation pseudo-class