TU Berlin

Online-StyleguideHauptnavigation

Page Content

to Navigation

There is no English translation for this web page.

Hauptnavigation

Die Hauptnavigation besteht aus einem div id="nav", in dem das Navigationsmenü enthalten ist. Die Navigationspunkte und ihre Ebenen bestehen nur aus Listenelementen (ul und li), die je nach Menütiefe verschachtelt werden.

HTML

    <ul>
<li><a href="#">Ebene eins</a></li>
<li><a href="#">Ebene eins</a></li>
<li><a href="#" class="standort">Ebene eins</a>
<ul>
<li><a href="#">Zweite Ebene</a></li>
<li><a href="#">Zweite Ebene</a></li>
<li><a href="#" class="standort">Zweite Ebene</a>
<ul>
<li><a href="#">Dritte Ebene</a></li>
<li><a href="#">Dritte Ebene</a></li>
<li><a href="#" class="current">Dritte Ebene</a></li>
</ul>
</li>
<li><a href="#">Zweite Ebene</a></li>
<li><a href="#">Zweite Ebene</a></li>
</ul>
</li>
<li><a href="#">Ebene eins</a></li>
</ul>

Der Standort wird jeweils im <a> mit der Klasse "standort" markiert. Der aktuelle Menüpunkt wird mit der Klasse "current" markiert.

Ist der Nutzer auf Ebene drei wird diese also mit der Klasse "current" ausgezeichnet, die dazugehörigen Ebenen 2 und 1 sind mit der Klasse "standort" markiert.

Hauptnavigation
Lupe

nächstes Kapitel:

Navigation

Quick Access

Schnellnavigation zur Seite über Nummerneingabe