Lunds universitet - Style Guide

Nav

Inverted

The standard behavior of links is to be underlined as default and to not be underlined when hovered over. Using the .nav-inverted class will invert this behavior so links are not underlined as default and underlined when hovered.

<a href="..." class="nav-inverted">Link text</a>

Undecorated

To have a link not be underlined as either default or hovered, use the .nav-undecorated class.

<a href="..." class="nav-undecorated">Link text</a>

Active

To mark a link as active in a nav, navbar, dropdown, etc; you can use the active class.

<nav class="nav">
    <a href="..." class="nav-link">Link 1</a>
    <a href="..." class="nav-link active">Link 2</a>
    <a href="..." class="nav-link">Link 3/a>
</nav>