Have you ever been lost, or don’t know how to find your way to a destination?
In such a situation the first thing most of us would do is open up google maps, type our destination and follow the route.
Google Maps navigates us to our destination.
In HTML The <nav>< element represents a section of a page whose purpose is to provide navigation links, either within the current document or to other documents.

Having easy-to-use navigation is important for any web site.
A navigation bar needs standard HTML as a base.
In below examples we have build the navigation bar from a standard HTML list.

A navigation bar is basically a list of links.

Exercise 12.1

Try the example below. 

  • Change the names in the menu
  • Try Changing  the names Home and About
  • See what happens if you remove the drop down class

Exercise 12.2

You are the proud owner of a famous restaurant. You are creating an online menu for it.
Create a Navigation Menu for your Restaurant
Your Menu Should be as Below:

Lunch Type
(Drop-Down list)
   a. Veg
   b. Non-Veg
   c. North-Indian
   d. South-Indian
Dinner Type
(Drop-Down list)
   a. Veg
   b. Non-Veg
   c. North-Indian
   d. South-Indian
About Us

Refer to the above example.