navigation a: hover

[Auge]

Hallo

Ich habe eine horizontale Navigation gebaut. In der Navigationliste sind die einzelnen Punkte mit Links und target hinterlegt. Mit der Pseudoklasse hover habe ich es jetzt schon hinbekommen, dass sich die drüber fahren mit der Maus die Hintergrundfarbe ändern. Gerne würde ich jetzt noch, dass der aktive angeklickte Punkt in der besagten Hintergrundfarbe stehen bleibt. Gibt es hier eine Möglichkeit nur mit html und css?

Erst mal zur Begriffskunde, damit wir alle hier nicht aneinander vorbei reden. Die Pseudoklasse :active wird aktiv bei einem interaktiven Element, wenn es gerade benutzt wird. Bei einem Link bedeutet das, dass die Formatierung für :active nur dann wirksam ist, wenn du den Link angeklickt hältst. Wenn du die Maustaste loslässt oder die Taste der Tastatur ausgelöst hat, ist der Status vorbei.

Wenn du die Markierung des aufgerufenen Menüpunkts meinst, hat das wiederum nichts mit der Pseudoklasse :active zu tun. Du hast dann üblicherweise ein neues Dokument aufgerufen. In diesem kannst du den Link zur aktuellen Seite speziell notieren, um ihn für CSS von den anderen Links unterscheidbar zu machen.

• Du kannst dem Link eine ID zuweisen (<a href="linktext.html" id="aktuelle-seite">Linktext</a>) und diese ID mit CSS ansprechen (#aktuelle-seite {}). Eine Klasse ginge auch, aber da es normalerweise in der Navi nur einen ausgewählten Punkt gibt, ist eine ID wohl passender.
• Du kannst den Link ohne das href-Attribut notieren (<a>Linktext</a>). Den Link kannst du in CSS mit a:not([href]) {} ansprechen. Falls du eine stark dynamische Seite hast, die von den Benutzern typischerweise über den Link in der Navi aktualisiert wird, dann fällt diese Möglichkeit allerdings flach.

Tschö, Auge