Não é possível encontrar um seletor de atributo css “diferente”

Desejo segmentar elementos div onde o atributo "foo" tem um valor.

<div foo="x">XXX</div>
<div foo="">YYY</div>

Eu tentei este css, mas não funciona:

[foo!='']
{
   background: red;
}

Use o código como este:

div:not([foo=''])
{
    /* CSS Applied to divs having foo value Not nothing (or having a foo value assigned) */
}

:not([foo=''])
{
    background: red;
}

http://jsfiddle.net/gsLvuys0/

Um problema com a resposta aceita é que ela também selecionará elementos que não possuem nenhum fooatributo. Considerar:

<div>No foo</div>
<div foo="">Empty foo</div>
<div foo="x">XXX</div>
<div foo="y">YYY</div>
<div foo="z">ZZZ</div>

div:not([foo=''])irá selecionar o primeiro e o segundo divelementos. Se você deseja apenas divelementos que têm um atributo foo definido como uma string vazia, você deve usar:

div[foo]:not([foo=''])

Se desejar todos os elementos com atributo fooque não seja ynem z, você deve usar:

div[foo]:not([foo='y']):not([foo='z'])

Você pode selecionar o primeiro usando

[foo = 'x']{
  background:red;
}

FIDDLE

Leia isso