• Menu
  • Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

JavaBeat

Java Tutorial Blog

  • Java
    • Java 7
    • Java 8
    • Java EE
    • Servlets
  • Spring Framework
    • Spring Tutorials
    • Spring 4 Tutorials
    • Spring Boot
  • JSF Tutorials
  • Most Popular
    • Binary Search Tree Traversal
    • Spring Batch Tutorial
    • AngularJS + Spring MVC
    • Spring Data JPA Tutorial
    • Packaging and Deploying Node.js
  • About Us
    • Join Us (JBC)
  • Java
    • Java 7
    • Java 8
    • Java EE
    • Servlets
  • Spring Framework
    • Spring Tutorials
    • Spring 4 Tutorials
    • Spring Boot
  • JSF Tutorials
  • Most Popular
    • Binary Search Tree Traversal
    • Spring Batch Tutorial
    • AngularJS + Spring MVC
    • Spring Data JPA Tutorial
    • Packaging and Deploying Node.js
  • About Us
    • Join Us (JBC)

HTML5 Nav Tag

March 12, 2014 //  by Krishna Srinivasan//  Leave a Comment

One of the new element used in the HTML5 is <nav>. The <nav> element in HTML5 is used to define the set of navigational links. This element is useful in grouping the links logically and giving the meaningful semantic markup which will be useful for the screen readers. This tutorial helps you to understand how to use this element in the web page. Not all the navigation links must be under the nav, only the major block of links has to be placed inside the nav tag.

The HTML5 specification says that:

The nav element represents a section of a page that links to other pages or to parts within the page: a section with navigation links. Not all groups of links on a page need to be in a nav element only sections that consist of major navigation blocks are appropriate for the nav element. In particular, it is common for footers to have a list of links to various key parts of a site, but the footer element is more appropriate in such cases, and no nav element is necessary for those links.

Syntax of <nav> Tag

<nav>Navigation controls</nav>

Supported Browsers

<nav> element in HTML5 is supported in Firefox, Opera, Chrome, Internet Explorer 9 and Safari 6. Using <nav> element we can combine all related links of site in a one web page. This element doesn’t have any attribute.

Example of <nav> Tag in HTML5

<!DOCTYPE html>
<html>
<head>
   <meta charset="UTF-8">
   <title>HTML 5 Example by JavaBeat.net</title>
</head>
<body>
   <nav>
     <a href="https://javabeat.net/">Javbeat</a> |
     <a href="http://www.yahoo.com">Yahoo</a> |
    </nav>
</body>
</html>

Example Application Test

  • Save the file as nav_example.html in your system.
  • Just open the file in the browser, you will see the below picture in the browser. Note that the browser must support HTML5 specification.

Output

When the execution process is completed successfully we will get the following output :
HTML5 Nav Tag

Category: HTMLTag: HTML5

About Krishna Srinivasan

He is Founder and Chief Editor of JavaBeat. He has more than 8+ years of experience on developing Web applications. He writes about Spring, DOJO, JSF, Hibernate and many other emerging technologies in this blog.

Previous Post: « HTML5 Footer Tag
Next Post: HTML5 DataList Tag »

Reader Interactions

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Primary Sidebar

Follow Us

  • Facebook
  • Pinterest

FEATURED TUTORIALS

New Features in Spring Boot 1.4

Difference Between @RequestParam and @PathVariable in Spring MVC

What is new in Java 6.0 Collections API?

The Java 6.0 Compiler API

Introductiion to Jakarta Struts

What’s new in Struts 2.0? – Struts 2.0 Framework

JavaBeat

Copyright © by JavaBeat · All rights reserved
Privacy Policy | Contact