[QUOTE]
I want my navigation bar with background color and hover, and I want my other anchor element styled differently from Navigation bar. I don’t want the same style automatically applied on both Navigation bar and other Anchor Element on my web page. So, how I do I stop the same style from Navigation bar applying to my other anchor element on my web page such as “go to top” link placed at the bottom of the web page, or other anchor element?
HTML CODE:
[code=html]<nav>
<ul>
<li><a href=”home.htm” >Home</a></li>
<li><a href=”aboutus.htm” >About Us</a></li>
<li><a href=”prod.htm” >Product & Services</a></li>
</ul>
</nav>
CSS CODE:
[code=html]nav{
background-image: url(nav.jpg);
line-height: 200%;
display: block;
text-align: center;
}
nav li{
display: inline;
list-style-type: none;
padding-right: 10%;
}
nav a{
color: white;
font-weight: bold;
text-decoration: none;
}
a:hover{
background-color: white;
color: crimson;
}
Anchor Element with HTML CODE:
[code=html]<a href=”http://www.countryliving.com”>Country Living Magazine</a>
[code=html]<a href=”#top”>Go to top</a>