Published Aug 24, 2021Updated Jul 1, 2022
Contribute to Docs

The <nav> element is used to define a list of navigation links such as menus and tables of contents.


<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#blog">Blog</a></li>

It is important to note that <nav> can be used inside of the <header> element, but it can also be used on its own.


Take a look at the navigation bar at the top of this Codecademy Docs page. It should look something like this in semantic HTML:

<!DOCTYPE html>
<head> </head>
<!-- The Codecademy Docs nav bar -->
<li><a href="https://www.codecademy.com/learn">My Home</a></li>
<li><a href="https://www.codecademy.com/catalog">Catalog</a></li>
<li><span title="Resources" class="dropdown">Resources</span></li>
<li><span title="Community" class="dropdown">Community</span></li>

All contributors

Looking to contribute?

Learn HTML on Codecademy