@@Martin Seidel > ~~~html > <ul id="gal-nav"> > <h3>Teppiche</h3> > <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> > <li><a href="gal-carpets-kl.php">Klassisch</a></li> > <li><a href="gal-carpets-nom.php">Nomaden- und <br>Dorfteppiche</a> > <h3>Kelims</h3> > <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> > <li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a> > </ul> > ~~~ Dass `h3` nicht Kindelement von `ul` sein darf, sagte doch schon jemand? Und wozu die `br`? Die Zeilenumbrüche macht der Browser automatisch. Das sollte eher so aussehen: ~~~html <h3>Teppiche</h3> <ul id="gal-carpets-nav"> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a href="gal-carpets-kl.php">Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und Dorfteppiche</a> </ul> <h3>Kelims</h3> <ul id="gal-kilims-nav"> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a> </ul> ~~~ oder wenn du Überschrift und Listen jeweils gruppieren möchtest: ~~~html <section id="gal-carpets-nav"> <h3>Teppiche</h3> <ul> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a href="gal-carpets-kl.php">Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und Dorfteppiche</a> </ul> </section> <section id="gal-kilims-nav"> <h3>Kelims</h3> <ul> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a> </ul> </section> ~~~ Dass bei `<li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a>`{: .language-html} die Beschriftung nicht stimmt, willst du sicher noch ändern. > Wie kann ich bei einem einzelnen Menüpunkt die Hintergrundfarbe ändern (so soll die gerade aktive Seite gekennzeichnet werden)? Habe es mit <style background-color=...>, damit wurde dann aber die Funktion des Links deaktiviert ?? Im `style`-Element müssen CSS-Regeln stehen, und zwar im Inhalt, nicht in einem Attribut. In etwa dasselbe, was auch in einem externen Styelsheet stehen kann. Wenn du die aktuelle Seite nicht im Menü verlinkst, sieht dein Markup für Menü auf der Teppiche-klassisch-Seite bspw. so aus: ~~~html <h3>Teppiche</h3> <ul id="gal-carpets-nav"> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a>Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und Dorfteppiche</a> </ul> <h3>Kelims</h3> <ul id="gal-kilims-nav"> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a> </ul> ~~~ (bzw. mit `section`s) Nun kannst du das `a`-Element, das kein `href`-Attribut hat, gezielt stylen: ~~~css a:not([href]) { background-color: …; } ~~~ Oder besser als Nachfahre des Navigationscontainers. (Das war vorher `<ul id="gal-nav">`{: .language-html}, aber das sind ja jetzt zwei Listen. Zur Not ginge auch ~~~css #gal-carpets-nav a:not([href]), #gal-kilims-nav a:not([href]) { background-color: …; } ~~~ Aber nur zur Not.) LLAP 🖖 -- _“The best way to help people learn: answer their coding question an hour later, they’ll have likely figured it out by then.”_{: lang="en"} —Todd Motto _[Selfcode](http://community.de.selfhtml.org/fanprojekte/selfcode.htm): `sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|`_{: style="display: block; font-size: 0.875em; font-style: inherit; margin-top:1.5em"}

@@Martin Seidel > ~~~html > <ul id="gal-nav"> > <h3>Teppiche</h3> > <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> > <li><a href="gal-carpets-kl.php">Klassisch</a></li> > <li><a href="gal-carpets-nom.php">Nomaden- und <br>Dorfteppiche</a> > <h3>Kelims</h3> > <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> > <li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a> > </ul> > ~~~ Dass `h3` nicht Kindelement von `ul` sein darf, sagte doch schon jemand? Und wozu die `br`? Die Zeilenumbrüche macht der Browser automatisch. Das sollte eher so aussehen: ~~~html <h3>Teppiche</h3> <ul id="gal-carpets-nav"> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a href="gal-carpets-kl.php">Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und Dorfteppiche</a> </ul> <h3>Kelims</h3> <ul id="gal-kilims-nav"> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a> </ul> ~~~ oder wenn du Überschrift und Listen jeweils gruppieren möchtest: ~~~html <section id="gal-carpets-nav"> <h3>Teppiche</h3> <ul> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a href="gal-carpets-kl.php">Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und Dorfteppiche</a> </ul> </section> </ection id="gal-kilims-nav"> <h3>Kelims</h3> <ul> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a> </ul> </section> ~~~ Dass bei `<li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a>`{: .language-html} die Beschriftung nicht stimmt, willst du sicher noch ändern. > Wie kann ich bei einem einzelnen Menüpunkt die Hintergrundfarbe ändern (so soll die gerade aktive Seite gekennzeichnet werden)? Habe es mit <style background-color=...>, damit wurde dann aber die Funktion des Links deaktiviert ?? Im `style`-Element müssen CSS-Regeln stehen, und zwar im Inhalt, nicht in einem Attribut. In etwa dasselbe, was auch in einem externen Styelsheet stehen kann. Wenn du die aktuelle Seite nicht im Menü verlinkst, sieht dein Markup für Menü auf der Teppiche-klassisch-Seite bspw. so aus: ~~~html <h3>Teppiche</h3> <ul id="gal-carpets-nav"> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a>Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und Dorfteppiche</a> </ul> <h3>Kelims</h3> <ul id="gal-kilims-nav"> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und Dorfteppiche</a> </ul> ~~~ (bzw. mit `section`s) Nun kannst du das `a`-Element, das kein `href`-Attribut hat, gezielt stylen: ~~~css a:not([href]) { background-color: …; } ~~~ Oder besser als Nachfahre des Navigationscontainers. (Das war vorher `<ul id="gal-nav">`{: .language-html}, aber das sind ja jetzt zwei Listen. Zur Not ginge auch ~~~css #gal-carpets-nav a:not([href]), #gal-kilims-nav a:not([href]) { background-color: …; } ~~~ Aber nur zur Not.) LLAP 🖖 -- _“The best way to help people learn: answer their coding question an hour later, they’ll have likely figured it out by then.”_{: lang="en"} —Todd Motto _[Selfcode](http://community.de.selfhtml.org/fanprojekte/selfcode.htm): `sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|`_{: style="display: block; font-size: 0.875em; font-style: inherit; margin-top:1.5em"}

@@Martin Seidel > ~~~html > <ul id="gal-nav"> > <h3>Teppiche</h3> > <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> > <li><a href="gal-carpets-kl.php">Klassisch</a></li> > <li><a href="gal-carpets-nom.php">Nomaden- und <br>Dorfteppiche</a> > <h3>Kelims</h3> > <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> > <li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a> > </ul> > ~~~ Dass `h3` nicht Kindelement von `ul` sein darf, sagte doch schon jemand? Und wozu die `br`? Die Zeilenumbrüche macht der Browser automatisch. Das sollte eher so aussehen: ~~~html <h3>Teppiche</h3> <ul id="gal-carpets-nav"> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a href="gal-carpets-kl.php">Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und <br>Dorfteppiche</a> </ul> <h3>Kelims</h3> <ul id="gal-kilims-nav"> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a> </ul> ~~~ oder wenn du Überschrift und Listen jeweils gruppieren möchtest: ~~~html <section id="gal-carpets-nav"> <h3>Teppiche</h3> <ul> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a href="gal-carpets-kl.php">Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und <br>Dorfteppiche</a> </ul> </section> </ection id="gal-kilims-nav"> <h3>Kelims</h3> <ul> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a> </ul> </section> ~~~ Dass bei `<li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a>`{: .language-html} die Beschriftung nicht stimmt, willst du sicher noch ändern. > Wie kann ich bei einem einzelnen Menüpunkt die Hintergrundfarbe ändern (so soll die gerade aktive Seite gekennzeichnet werden)? Habe es mit <style background-color=...>, damit wurde dann aber die Funktion des Links deaktiviert ?? Im `style`-Element müssen CSS-Regeln stehen, und zwar im Inhalt, nicht in einem Attribut. In etwa dasselbe, was auch in einem externen Styelsheet stehen kann. Wenn du die aktuelle Seite nicht im Menü verlinkst, sieht dein Markup für Menü auf der Teppiche-klassisch-Seite bspw. so aus: ~~~html <h3>Teppiche</h3> <ul id="gal-carpets-nav"> <li><a href="gal-carpets-zg.php">Zeitgenössisch</a></li> <li><a>Klassisch</a></li> <li><a href="gal-carpets-nom.php">Nomaden- und <br>Dorfteppiche</a> </ul> <h3>Kelims</h3> <ul id="gal-kilims-nav"> <li><a href="gal-kilims-zg.php">Zeitgenössisch</a></li> <li><a href="gal-kilims-nom.php">Nomaden- und <br>Dorfteppiche</a> </ul> ~~~ (bzw. mit `section`s) Nun kannst du das `a`-Element, das kein `href`-Attribut hat, gezielt stylen: ~~~css a:not([href]) { background-color: …; } ~~~ Oder besser als Nachfahre des Navigationscontainers. (Das war vorher `<ul id="gal-nav">`{: .language-html}, aber das sind ja jetzt zwei Listen. Zur Not ginge auch ~~~css #gal-carpets-nav a:not([href]), #gal-kilims-nav a:not([href]) { background-color: …; } ~~~ Aber nur zur Not.) LLAP 🖖 -- _“The best way to help people learn: answer their coding question an hour later, they’ll have likely figured it out by then.”_{: lang="en"} —Todd Motto _[Selfcode](http://community.de.selfhtml.org/fanprojekte/selfcode.htm): `sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|`_{: style="display: block; font-size: 0.875em; font-style: inherit; margin-top:1.5em"}