Zaznacz elementy, gdzie atrybut jest niepusty

Question

Załóżmy, że mam następujące:

<div data-pid="">Unknown</div> 
<div data-pid="123">Known 123</div> 

Czy istnieje sposób w CSS, aby wybrać tylko te elementy, w których atrybut data-pid nie jest pusty?

Answer 1

To działa, jeśli nie masz nic robić rzeczy lekko do tyłu i trzeba go do pracy w przeglądarkach, które nie obsługują :not:

div[data-pid] { 
    color: green; 
} 

div[data-pid=""] { 
    color: inherit; 
} 

To uczyni wszelkie div S z niepusty data-pid s zielony.

Fiddle tutaj: http://jsfiddle.net/ZuSRM/

Answer 2

wygląda brzydko, ale coś takiego powinno wystarczyć:

[data-pid]:not([data-pid=""]) 

jsFiddle Demo

Przy odrobinie JavaScript można także dodać klas, jeśli trzeba wspierać starszych przeglądarek.

Answer 3

/* Normal styles */ 
[data-pid] {} 

/* Differences */ 
[data-pid=""] {} 

jsFiddle.

To będzie miało znacznie lepszą obsługę przeglądarki. Zamiast wybierać te, które chcesz, wszystkie style, a następnie umieścić różnice w drugim selektorze.