Liebe Ratgeberinnen und Ratgeber
Ich bin daran die Navigation meiner Homepage ( Michael Ritter ) auszubauen. Das Ziel ist eine verschachtelte Navigation, wobei die Unterpunkte (nur) beim Hovern ausgeklappt und sonst unsichtbar sein sollen. Die oberste Navigationsleiste soll horizontal sein. Das Ganze soll nur mit HTML und CSS realisiert werden (also ohne Javascript oder Gröberes).
Es geht mir nicht darum, dass Ihr mir das baut8). Ich habe bei der Lektüre der verschiedenen Tutorials jedoch gemerkt, dass das nicht eine ganz triviale Aufgabenstellung ist. Ich möchte nun schrittweise vorgehen und habe vorerst folgende rein html-bezogene Frage:
Wenn ich es richtig verstanden habe, beruht der HTML-Code solcher fortgeschrittenen Navigationsleisten darauf, dass Listen ( <ul> ) verschachtelt werden können, d. h. Listen können (Unter-)Listen enthalten. Die Verschachtelung erfolgt so, dass die Unterliste in ein Listenelement der Oberliste "eingepackt" ist, so dass die Reihenfolge <ul> <li> <ul> <li> usw. entsteht.
Die konkrete Bitte ist nun, den HTML-Code meiner Testseite ( http://www.michaelritter.ch/testseite.htm ) dahingehend zu prüfen, ob er sich eignet, um daraus (mit CSS) dann eine komplexe Navigation der gewünschten Art zu bauen. CSS ist auf der Testseite bewusst "abgeschaltet". Der Code (aufs Themenrelevante verkürzt) lautet:
Ich danke für die ggf. kritische Review!
Wer einen Gratistipp für die Weiterarbeit (also fürs CSS) hat, dem verbiete ich nicht ihn zu geben!
Lg Xeno
Ich bin daran die Navigation meiner Homepage ( Michael Ritter ) auszubauen. Das Ziel ist eine verschachtelte Navigation, wobei die Unterpunkte (nur) beim Hovern ausgeklappt und sonst unsichtbar sein sollen. Die oberste Navigationsleiste soll horizontal sein. Das Ganze soll nur mit HTML und CSS realisiert werden (also ohne Javascript oder Gröberes).
Es geht mir nicht darum, dass Ihr mir das baut8). Ich habe bei der Lektüre der verschiedenen Tutorials jedoch gemerkt, dass das nicht eine ganz triviale Aufgabenstellung ist. Ich möchte nun schrittweise vorgehen und habe vorerst folgende rein html-bezogene Frage:
Wenn ich es richtig verstanden habe, beruht der HTML-Code solcher fortgeschrittenen Navigationsleisten darauf, dass Listen ( <ul> ) verschachtelt werden können, d. h. Listen können (Unter-)Listen enthalten. Die Verschachtelung erfolgt so, dass die Unterliste in ein Listenelement der Oberliste "eingepackt" ist, so dass die Reihenfolge <ul> <li> <ul> <li> usw. entsteht.
Die konkrete Bitte ist nun, den HTML-Code meiner Testseite ( http://www.michaelritter.ch/testseite.htm ) dahingehend zu prüfen, ob er sich eignet, um daraus (mit CSS) dann eine komplexe Navigation der gewünschten Art zu bauen. CSS ist auf der Testseite bewusst "abgeschaltet". Der Code (aufs Themenrelevante verkürzt) lautet:
HTML:
<html>
<head>
</head>
<body>
<ul id="navigationsleiste">
<li id="aktiv">
<span>Hauptseite</span>
</li>
<li>
<a href="http://www.michaelritter.ch/politik.htm">Politik></a>
<ul>
<li>
<a href="http://www.michaelritter.ch/politik2.htm">Biographie</a>
</li>
</ul>
</li>
<li>
<a href="http://www.michaelritter.ch/vereine.htm">Vereine></a>
<ul>
<li>
<a href="http://www.michaelritter.ch/radioemme.htm">Radio Emme</a>
</li>
<li>
<a href="http://www.michaelritter.ch/dampflokfest.htm">Dampflokfest</a>
</li>
</ul>
<li>
<a href="http://www.michaelritter.ch/links.htm">Links</a>
</li>
<li>
<a href="http://www.michaelritter.ch/kontakt.htm">Kontakt</a>
</li>
<li>
<a href="http://www.michaelritter.ch/changelog.htm">Changelog</a>
</li>
<li>
<a href="http://www.michaelritter.ch/impressum.htm">Impressum</a>
</li>
</ul>
</body>
Ich danke für die ggf. kritische Review!
Wer einen Gratistipp für die Weiterarbeit (also fürs CSS) hat, dem verbiete ich nicht ihn zu geben!
Lg Xeno