In this exercise you'll create a navigation bar.
<!DOCTYPE HTML><HTMLLang= "en"><Head><MetaCharSet=utf-8><title>HTML CSS exercise-create a simple Navigaiton bar</title><styletype= "Text/css">nav{Display:Block;position:Absolute;Top:0;width:100%;Background-color:Green;}Li{List-style-type:None;Display:inline;Margin-right:20px;font-size:25px}A:link{Color:#fff;text-decoration:None;}a:hover{Color:Orange;text-decoration:None;}li > Ul{Display:None}Li:hover ul{Display:Block;position:Absolute; Left:200px;Background-color:Green;margin:0;}Li:hover ul Li A:link{Display:Block;Margin-left:-30px;}</style></Head><Body><nav> <ul> <Li> <ahref="#">Home</a> </Li> <Li> <ahref="#">About</a> </Li> <Li> <ahref="#">Products</a> <ul> <Li> <ahref="#">Engineering</a> </Li> <Li> <ahref="#">Telecom</a> </Li> <Li> <ahref="#">Energy</a> </Li> <Li> <ahref="#">Finance</a> </Li> <Li> <ahref="#">Consultancy</a> </Li> </ul> </Li> <Li> <ahref="#">Services</a> </Li> <Li> <ahref="#">Contact</a> </Li> </ul></nav></Body></HTML>
:
Use CSS and HTML to complete a simple navigation (NAV)