Drop-Down Navigation menu bar in Html/Css code

Attractive drop down navigation menu for websites.Drop down menu tutorial.
Navigation bar helps the visitor to navigate the web site.It also help in search engine optimization.

HTML:

<ul id="navbar">
<li><a href="#">Item One</a><ul>
<li><a href="#">Subitem One</a></li>
<li><a href="#">Second Subitem</a></li>
<li><a href="#">Numero Tres</a></li></ul>
</li>
       <li><a href="#">Item Two</a><ul>
<li><a href="#">1 Under Item two </a></li>
<li><a href="#">2 Under Item two</a></li>
<li><a href="#">3 Under Item two</a></li></ul>
</li>
<!-- ... and so on ... -->
</ul>

CSS:

#navbar {

margin: 0;

padding: 0;

height: 1em; }

#navbar li {

list-style: none;

float: left; }

#navbar li a {

display: block;

padding: 3px 8px;

background-color: #5e8ce9;

color: #fff;

text-decoration: none; }

#navbar li ul {

display: none; 

width: 10em; /* Width to help Opera out */

background-color: #69f;}

#navbar li:hover ul {

display: block;

position: absolute;

margin: 0;

padding: 0; }

#navbar li:hover li {

float: none; }

#navbar li:hover li a {

background-color: #69f;

border-bottom: 1px solid #fff;

color: #000; }

#navbar li li a:hover {

background-color: #8db3ff; }

More animated flash navigation menu bars.
_______________________________________________________________________________