CSS Menubar Aufklappen

[Maxwill]

Hallo Community ,

Ich habe mir eine Menu runter geladen und nun würde ich diese gerne noch etwas erweiter.
Diese soll später wenn ich über die erste liste mit den menu pkt. gehen eine zweite liste mit unterpkt. nebendran aufmachen.
Ich habe nun nachgelsen und auch schon bsp. gefunden allerdings komme ich nicht damit klar es in mein bestehendes css so einzufügen das es richtig klappt :(

Hier der bisherige Css teil:

.urbangreymenu{
float:left;
width: 8%;
min-width: 135px;
max-width: 135px;
text-align: left;
}

.urbangreymenu .headerbar{
font: bold 10px Verdana;
color: white;
background: #606060 url(Images/downgreen.gif) no-repeat 8px 6px; 
margin-bottom: 0;
text-transform: uppercase;
padding: 7px 0 7px 31px;
}

.urbangreymenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 0; 
}

.urbangreymenu ul li{
padding-bottom: 2px; 

}

.urbangreymenu ul li a{
font: normal 12px Arial;
color: black;
background: #E9E9E9;
display: block;
padding: 5px 0;
line-height: 15px;
padding-left: 8px;
text-decoration: none;
}



.urbangreymenu ul li a:visited{
color: black;
}

.urbangreymenu ul li a:hover {
color: white;
background-image:url(Images/header_bg.png) ;
}

Und hier ein ausschnitt meiner HTML daten:

<div class="urbangreymenu"  width=150;>
                <h3 class="headerbar">HTML</h3>
                <ul>
                <li><a href="HTML/Einstieg/Einstieg1.html">Einstieg</a></li>
                <li><a href="HTML/Zeichen/Zeichen1.html">Text- u. Zeichenformatierung</a></li>
                <li><a href="HTML/Tables/Tables1.html">Table</a></li>
                <li><a href="HTML/Frames/Frames1.html">Frame</a></li>
                <li><a href="HTML/Formulare/Formulare1.html">Formulare</a></li>
                <li><a href="Test/HTMLTest1.html">HTML Test</a></li>
                </ul>

Das ganze sieht dann so aus.




ich ich würde es gerne so haben ;D




wie kann ich das nun in dem schon vorhandenen css code ordentlich einbauen?
Ein guter ansatzen wäre mir schon eine sehr gute hilfe.

Dank euch

Gruß Maxwill

 

[vitus37]

Die Zauberwörer heissen display und hover.
Mit dem CSS-Attribut display kannst du ein Element verstecken oder anzeigen lassen, mit der Pseudoklasse hover kannst du bestimmen, wann display eintreten soll (wenn man eben mit der Maus über einen Link fährt).
Ein Link: Vertikales Ausklapp-Menü
Lerne das Tut etwas durch, dann dürftest du es auf deine Navigation abwandeln können.

 

[Elroy]

Hallo.

Da aber zumindest beim angezeigten HTML Code kein Untermenü vorhanden ist kann auch keins angezeigt werden.
Zu allererst muss der HTML Code stimmen.

Gruss
Elroy

 

[Loon3y]

....text....

Das ganze sieht dann so aus.

Anhang anzeigen 1547
ich ich würde es gerne so haben ;D

Anhang anzeigen 1548

vllt sollte man anstelle eines weiteren überflüssigen HTML- / CSS-Tutorial-Versuchs (wie wenn man das Rad wirklich neu erfinden könnt), ersteinmal das lernen, worüber man schreiben will.

NYAHCT :O

scnr.
Loon3y