Grafik -Aufzählungszeichen nur bei a:hover

[jenskie]

hallo, ich möchte für meine Navigationsliste immer bei a:hover eine Grafik als Aufzählungszeichen anzeigen lassen. Fällt mir echt schwer das zu erstellen. Habe bisher nur mistversuche erstellt. Deshalb nur mein bisheriger Code:
html:

<ul id="naviliste">
<li><a href="">Start</a></li>
<li><a href="">Geschichte</a></li>
<li><a href="">Bestattungsarten</a></li>
<li><a href="">Bestattungszubeh&ouml;r</a></li>
<li><a href="">Friedhof/Kommune</a></li>
<li><a href="">Unsere Leistungen</a></li>
<li><a href="">Im Trauerfall</a></li>
<li><a href="">Formalit&auml;ten</a></li>
<li><a href="">Vorsorge</a></li>
<li><a href="">Links</a></li>
<li><a href="">Impressum</a></li>
</ul>

css:

#naviliste ul{
 padding:0;
 margin:0 0 0 50px;
 width:265px;
 list-style-position: outside;
 list-style-type:none;
}
#naviliste li {
 list-style-type:none;
}
#naviliste li a{
 text-decoration:none;
 font-size: 1.1em;
 color:black;
 background-color:transparent;

}

[Kai345]

Grütze .. äh ... Grüße!

hallo, ich möchte für meine Navigationsliste immer bei a:hover eine Grafik als Aufzählungszeichen anzeigen lassen. Fällt mir echt schwer das zu erstellen. Habe bisher nur mistversuche erstellt. Deshalb nur mein bisheriger Code:

css:

In diesem CSS sehe ich weder eine Zuweisung für :hover noch eine Referenz zu einer Grafik.
So kann man leider nicht sehen, was du falsch gemacht hast.
Bitte vollständiges CSS oder link (falls beispielseite online)

Cü
Kai

[jenskie]

ich habe jetzt jedem link eine "id" vergeben. Hier mein kläglicher Versuch:
html:
<div id="navi">
<ul id="naviliste">
<li><a href="" id="start">Start</a></li>
<li><a href="" id="geschichte">Geschichte</a></li>
<li><a href="" id="bestattungsarten">Bestattungsarten</a></li>
<li><a href="" id="bestattung">Bestattung</a></li>
<li><a href="" id="friedhof">Friedhof/Kommune</a></li>
<li><a href="" id="leistungen">Unsere Leistungen</a></li>
<li><a href="" id="trauerfall">Im Trauerfall</a></li>
<li><a href="" id="formalitäten">Formalit&auml;ten</a></li>
<li><a href="" id="vorsorge">Vorsorge</a></li>
<li><a href="" id="links">Links</a></li>
<li><a href="" id="impressum">Impressum</a></li>
</ul>
</div>

css:
#naviliste ul{
 padding:0;
 margin:0 0 0 50px;
 width:265px;
 list-style-position: outside;
 list-style-type:none;
}
#naviliste li {
 list-style-type:none;
}
#naviliste li a{
 text-decoration:none;
 font-size: 1.1em;
 color:black;
 background-color:transparent;

}

#start a:hover{
background: #ffffff url(img/kreuz.gif) no-repeat;
}

[Cheatah]

Hi,

<li><a href="" id="start">Start</a></li>
#start a:hover{

innerhalb des Elementes mit der ID "start" befindet sich kein <a>-Element. Das wäre auch ungültig, da das Element mit dieser ID selbst ein Link ist, welcher kein <a>-Element enthalten darf.

Cheatah

[LightG2K]

Moin zusamen!

Versuchs mal hiermit:

CSS

#naviliste {
 padding:0;
 margin:0 0 0 50px;
 width:265px;
 list-style-position: outside;
 list-style-type:none;
}
#naviliste li a {
 text-decoration:none;
 font-size: 1.1em;
 color:black;
 background-color:transparent;
}
#naviliste li a:hover {
 background-image:url(bild.gif);
 background-repeat:no-repeat;
}

HTML

<ul id="naviliste">
<li><a href="#">Start</a></li>
<li><a href="#">Geschichte</a></li>
<li><a href="#">Bestattungsarten</a></li>
<li><a href="#">Bestattungszubeh&ouml;r</a></li>
<li><a href="#">Friedhof/Kommune</a></li>
<li><a href="#">Unsere Leistungen</a></li>
<li><a href="#">Im Trauerfall</a></li>
<li><a href="#">Formalit&auml;ten</a></li>
<li><a href="#">Vorsorge</a></li>
<li><a href="#">Links</a></li>
<li><a href="#">Impressum</a></li>
</ul>

MfG
LightG2J

[jenskie]

Moin zusamen!

Versuchs mal hiermit:

CSS

#naviliste {
padding:0;
margin:0 0 0 50px;
width:265px;
list-style-position: outside;
list-style-type:none;
}
#naviliste li a {
text-decoration:none;
font-size: 1.1em;
color:black;
background-color:transparent;
}
#naviliste li a:hover {
background-image:url(bild.gif);
background-repeat:no-repeat;
}

HTML

<ul id="naviliste">
<li><a href="#">Start</a></li>
<li><a href="#">Geschichte</a></li>
<li><a href="#">Bestattungsarten</a></li>
<li><a href="#">Bestattungszubeh&ouml;r</a></li>
<li><a href="#">Friedhof/Kommune</a></li>
<li><a href="#">Unsere Leistungen</a></li>
<li><a href="#">Im Trauerfall</a></li>
<li><a href="#">Formalit&auml;ten</a></li>
<li><a href="#">Vorsorge</a></li>
<li><a href="#">Links</a></li>
<li><a href="#">Impressum</a></li>
</ul>

MfG
LightG2J

Juhu! Endlich. Da ist so eine Art Aufzählungzeichen gekommen bei a:hover. Ich nehme an jetzt muss ich nur noch platz schaffen. Vielen Dank