PDA

View Full Version : Assign differant hover styles to differant navbars?


LoveLeather
07-12-2007, 09:51 AM
www.loveleather.co.uk (http://www.loveleather.co.uk)

Down the left menu I want the cell to highlight, which I have managed, it also underlines, but thats easy to get rid off.

The top navbar I only want underline when you hover.

I think I have to name both navbar links then create the css to point to them so they act differantly, but need some tips on doing so.

So far I only have this code in the head tags to control the lot..


<style type='text/css'>
<!--
a{text-decoration:none;color:#4B4B4B;}
a:visited{color:#4B4B4B;}
a:hover{display:block;width:100%;text-decoration:underline;color:#4B4B4B;background:#C0C 0C0;}
a:active{text-decoration:none;color:#4B4B4B;}
.point{
cursor:hand;
}

edbr
07-12-2007, 10:38 AM
look into making a seperate style sheet rather than styles on your pages and then you can more easily assign different a attributes to classes and divisions.

LoveLeather
07-12-2007, 11:10 AM
Yes I understand the principle, but really dont understand how to start to do that.

Does that mean the tags my links are in need namess, then you create and assign a style to them.

I need a brief example...

domedia
07-12-2007, 05:51 PM
Here's an example on how you can do it

<div id="navtwo">
<a href="services.html">Services</a>
<a href="products.html">Products</a>
<a href="about.html">About Us</a>
</div>

#navtwo a:link {color: red;}
#navtwo a:visited {color: red;}
#navtwo a:hover {color: green;}
#navtwo a:active {color: red;}

First snippet of code is an example of your HTML, the second snippet is an example of the corresponding CSS.