Hallo,
das Beispiel klappt nur, wenn das Bild in der gleichen Rootebene ist und value keine URL enthält.
Was zu beweisen wäre ;-).
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Testseite Graphiken in Option-Elementen</title>
<style type="text/css">
option#deutschland:before { content:url("http://aktuell.de.selfhtml.org/artikel/css/optionbilder/de.gif"); }
option[value="http://www.google.de/search?q=irland"]:before { content:url("http://aktuell.de.selfhtml.org/artikel/css/optionbilder/ie.gif"); }
</style>
</head>
<body>
<p>
<select size="3">
<option id="deutschland" value="http://www.google.de/search?q=deutschland">Deutschland</option>
<option id="irland" value="http://www.google.de/search?q=irland">Irland</option>
</select>
</p>
</body>
</html>
Das funktioniert bei Dir im FireFox nicht?
Es existiert allerdings ein Problem, wenn im Wert von value ein Semikolon enthalten ist, bspw.: value="http://www.google.de/search?hl=de&q=irland". Dann funktioniert der Attribut-Selektor nicht mehr. Wie man das umgehen kann, habe ich mit dem Id-Selektor für Deutschland gezeigt.
viele Grüße
Axel