Ergebnis 1 bis 3 von 3

Thema: Navigationsmenü mit verschiedenen Farben versehen

  1. #1
    Contao-Nutzer Avatar von WolfgangW
    Registriert seit
    05.10.2016.
    Ort
    Mönchengladbach
    Beiträge
    35

    Standard Navigationsmenü mit verschiedenen Farben versehen

    Hallo Contao-Gemeinde!

    Ich beschäftige mich (rein hobbymäßig) seit drei Monaten mit Contao und habe meine erste Contao-Homepage fast fertig.
    Als nächste Aufgabe möchte ich eine bestehende Homepage ebenfalls in Contao umsetzen.
    Die Herausforderung liegt darin, dass die horizontale Navigation aus sechs Menüpunkten mit sechs unterschiedlichen Farben besteht. Die entsprechenden Farben setzen sich dann in den einzelnen Seiten als farbige Ränder fort.

    Wie definiere ich in der Contao-Navigation die unterschiedlichen Farben?
    Das Nav-Template besteht ja aus einer Endlosschleife. Hier gibt es die Klassen first, level_2 und last, aber alle identisch pro Menüpunkt.
    Mit meinen bescheidenen PHP-Kenntnissen überlege ich, die Endlosschleife aufzulösen und jeden der sechs Menüpunkte explizit zu definieren. Hier könnte ich dann die separaten CSS-ID's einbinden. Ist der Lösungsansatz richtig oder gibt es einen einfacheren Weg?

    Danke vorab für die Hilfe!

  2. #2
    Community-Moderator
    Wandelndes Contao-Lexikon
    Avatar von Spooky
    Registriert seit
    12.04.2012.
    Ort
    Scotland
    Beiträge
    34.133
    Partner-ID
    10107

    Standard

    Dazu definierst du bei den jeweiligen Seiten in der Seitenstruktur eine entsprechende CSS Klasse. Diese scheint dann auch im Menü auf.

  3. #3
    Community-Moderatorin & Contao-Urgestein Avatar von mlweb
    Registriert seit
    10.07.2011.
    Beiträge
    6.762
    Contao-Projekt unterstützen

    Support Contao

    Standard

    Alternativ kann man auch die pseudoselektoren nth-child oder nth-of-type verwenden.
    Wird zum Beispiel bei mediaevent.de ganz gut erklärt.
    Ich habe Dir mit meinen Hinweisen geholfen und Du möchtest Dich bedanken?
    Unterstütze bitte das Contao-Projekt (Button Links)
    Weitere Spendenmöglichkeiten
    ------------------------------------------------------------------------------------------------------
    Contao-Dokumentation: Contao-Handbuch und Contao-Entwickler-Doku
    Contao-Online-Video-Kurse: Contao Academy
    Funktionalität erweitern: Contao-Erweiterungen

    Für Dinge die man mit html5 und css3 lösen kann, braucht man kein javascript.




Aktive Benutzer

Aktive Benutzer

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •