Navi-Leiste mit Unterktegorien

Schönen Tag zusammen,
folgendes Problem:
Ich habe für einen Shop eine Navileiste mit html und eingebundenem css erstellt. Habe mir in einem Ein-Tag-Crash-Kurs selbst beigebracht, besitze also im Moment noch keine weiterführenden Kenntnisse…

Nun brauche ich aber auch Unterkategorien, wenn ich einen Punkt in der Navileiste anklicke, sollte sich ein Untermenü mit weiterführenden Links öffnen, z.B. „Bekleidung“>>>>„Blusen“>>>„Hosen“>>>„Westen“…u. s.w…

Ich würde gerne das erstellte Menü soweit beibehalten. Gibt es einen Code den ich in unten aufgeführten irgendwie einbauen kann? Vielen lieben Dank im voraus.

Gruss
LillyStern

PS: Die Links sind ein bisschen lang, aber ist halt auf dem Webspace so.

Der Quellcode lautet:

<html>
<head>
<style type="text/css">
 
#navi {width:240px; text-align:right; margin-top:5px; margin-botom:5px; margin-left:5px; margin-right:5px;}
 
#navi ul {list-style:none;}
 
#navi li {background-color:#FFCCFF; border-top:5px #C71585 double; border-left:5px #C71585 double; border-bottom:5px #C71585 double; border-right:5px #C71585  double; margin-top:6px; padding-top:8px; padding-bottom:8px; padding-left:4px; padding-right:8px;
 
</style>
</head>
 
<body>
 
<div id="navi"> 
 
<ul> 
<li><img src=" http://freenet-homepage.de/Tulpendiebin.freenet.de/Ebay/girl-1-48x48.png " align="left" width="40" height="40">
<a href="http://stores.ebay.de/Cloth-n-Roses_Damen-Bekleidung_W0QQcolZ2QQdirZ1QQfsubZ10638676QQftidZ2QQtZkm">Damen-Bekleidung</a></li>
 
<li><img src=" http://freenet-homepage.de/Tulpendiebin.freenet.de/Ebay/boy-3-48x48.png " align="left" width="40" height="40">
<a href="
http://stores.ebay.de/Cloth-n-Roses_Herren-Bekleidung_W0QQcolZ2QQdirZ1QQfsubZ10638677QQftidZ2QQtZkm">Herren-Bekleidung</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiEOyHseJkgjxM&size=l " align="left" margin-left="2">
<a href="
http://stores.ebay.de/cloth-n-roses_Accessoires_W0QQcolZ2QQdirZ1QQfsubZ10400973QQftidZ2QQtZkm">Accessoires</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiEPP3D4kVSxdo&size=l " align="left">
<a href="http://stores.ebay.de/Cloth-n-Roses_Schmuck_W0QQcolZ2QQdirZ1QQfsubZ10541551QQftidZ2QQtZkm">Schmuck</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiEG9BUALtkpOc&size=l " align="left">
<a href="http://stores.ebay.de/Cloth-n-Roses_Kids_W0QQcolZ2QQdirZ1QQfsubZ10400974QQftidZ2QQtZkm">Kids</a></li>
 
<li><img src="
 http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiELvsHMF*rBxo&size=l " align="left">
<a href="http://stores.ebay.de/Cloth-n-Roses_Bucher_W0QQcolZ2QQdirZ1QQfsubZ10400975QQftidZ2QQtZkm">Buecher</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiECZx8gXzUwbb&size=l " width="40" height="40" align="left">
<a href="http://stores.ebay.de/Cloth-n-Roses_Elektronik_W0QQcolZ2QQdirZ1QQfsubZ10400976QQftidZ2QQtZkm">Elektronik</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic? 
id=21c0CxsmUBlXzM1FlvKDytNiEBR9hkVYqAQN&size=l" align="left">
<a href="http://stores.ebay.de/Cloth-n-Roses_Deko_W0QQcolZ2QQdirZ1QQfsubZ10492882QQftidZ2QQtZkm">Deko</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiEOAaupVC5mUR&size=l " align="left">
<a href="
http://stores.ebay.de/Cloth-n-Roses_Haushalt_W0QQcolZ2QQdirZ1QQfsubZ10492883QQftidZ2QQtZkm">Haushalt</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic? 
id=21c0CxsmUBlXzM1FlvKDytNiEDrLYdfVOhmh&size=l" align="left">
<a href="
http://stores.ebay.de/Cloth-n-Roses_Saisonales-Ostern_W0QQcolZ2QQdirZ1QQfsubZ10628038QQftidZ2QQtZkm">Ostern</a></li>
 
<li><img src=" http://links.pictures.aol.com/pic?id=21c0CxsmUBlXzM1FlvKDytNiEChXOyP*OU*g&size=l " align="left">
<a href="<A href="http://stores.ebay.de/Cloth-n-Roses_Sonstige_W0QQcolZ2QQdirZ1QQfsubZ1QQftidZ2QQtZkm">Sonstiges</a></li></ul></div>
 
</body>
</html>

Oh, sorry. Habe nicht gesehen, dass das Thema hier schon angeschlagen wurde:oops: .

Ich schaue mir mal die Vorschläge an, die unter dem entsprech. Thread stehen und melde mich wieder, wenn ich Fragen habe.

Gruss
LillyStern

also fürs hovern hätte ich was:

li ul {display: none;} 
li:hover > ul {display: block;} 

Nils aka XraYSoLo

Hallo Nils aka XraySoLo…

wo genau muss ich den Kram einbauen, und wo kommen die Links zu den Unterkategorien hin?

Ich schau mal nachher wieder rein, muss jetzt offline gehen…;Jump

in den head-bereich oder als externe CSS-datei.

http://meyerweb.com/eric/css/edge/menus/demo.html

Nils aka XraYSoLo

Bin noch da :smiley: Danke. Werde das offline mal ausprobieren, und mir auch mal die anderen Seiten im anderen Thread ansehen…

Gruss
LillyStern