nav element
If you don't know what an element is or how you must use it, I recommend you read the "HTML tags and attributes" tutorial that you can find in the HTML tutorials section.
Table of contents
Description
The nav
element is a container for navigational links, supposed to provide ways to access the sections of a website, as well as to external documents. The links inside this element, are supposed to belong to major navigation blocks only.
Examples
Below you'll see a straight list of links to the main sections of a website, correctly wrapped in a nav
element. This navigation block is preceding the main content of the document, as could be found in real examples.
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/tutorials.html">Tutorials</a></li>
<li><a href="/reference.html">Reference</a></li>
<li><a href="/tools-resources.html">Resources</a></li>
<li><a href="/contactus.php">Contact me</a></li>
</ul>
</nav>
<section>
<h1>HTML tutorials and reference</h1>
<p>This is a website dedicated to provide a set of tutorials for the most used language of the web...</p>
</section>
HTML tutorials and reference
This is a website dedicated to provide a set of tutorials for the most used language of the web...
Our second example shows an innovative navigation section. There, links to the main sections of the website are presented in prose.
<nav>
<p>Besides the <a href="/">home</a>, you'll see the main content of the website divided in three sections: the <a href="/tutorials.html">tutorials</a>, the <a href="/reference.html">reference</a> and the <a href="/tools-resources.html">resources</a>. Don't forget to <a href="/contactus.php">contact me</a> in case you have any inquiry.</p>
</nav>
Attributes
Global attributes
For information about global attributes refer to this list of global attributes in HTML5.
Events
Global events
For information about global events refer to this list of global events in HTML5.