|
| |
|
|
barking mad
Posts: 274
Joined: 12/6/2002
From: Out in the sticks, UK
Status: offline
 |
hyperlink colors - 8/21/2006 9:37:41
I have some text based links which when using css are shown in bold when hovering over.
I want to show the link to the current page in bold at al times (whatver that page might be)
is this possible using css? if so how please?
_____________________________
The more I ask, the more I learn, the more I' m confused, therefore the more I ask ...
|
|
|
|
barking mad
Posts: 274
Joined: 12/6/2002
From: Out in the sticks, UK
Status: offline
|
RE: hyperlink colors - 8/21/2006 10:08:46
A:link
{
FONT-SIZE: 10pt;
COLOR: #cccccc;
font-family:Verdana, Arial, Helvetica, sans-serif;
TEXT-DECORATION: none;
}
A:visited
{
FONT-SIZE: 10pt;
COLOR: #cccccc;
font-family:Verdana, Arial, Helvetica, sans-serif;
TEXT-DECORATION: none
}
a:hover
{
FONT-SIZE: 10pt;
COLOR: #003399;
font-family:Verdana, Arial, Helvetica, sans-serif;
TEXT-DECORATION: none
}
A:active
{
FONT-SIZE: 10pt;
COLOR: #cccccc;
font-family:Verdana, Arial, Helvetica, sans-serif;
TEXT-DECORATION: none;
}
The hover works no problem but I want the "current page" to remain either in bold or different colour. When i move to another page, the new page remains highlighted when on that one and the first page returns to a normal state.
_____________________________
The more I ask, the more I learn, the more I' m confused, therefore the more I ask ...
| |
|
|
|
Tailslide
Posts: 6003
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: hyperlink colors - 8/21/2006 10:25:23
You can either give the current menu item a specific class on each page and then add a rule into your stylesheet specifically for that "current" menu item OR, (and this is an easier way if you can manage it) give each page a specific id like this:
<body id="home">
for instance on your homepage. Then give every menu item a specific id too like this:
<ul>
<li><a href="whatever.html" id="nav-home">Home</a></li>
<li><a href="apage.html" id="nav-contact">Contact</a></li>
</ul>
Then in your stylesheet you add in a specific rule for your current page like this:
#home #nav-home, #contact #nav-contact (etc etc) {your rule goes here}
The advantage of doing it this way is that you can have exactly the same menu list on every page - you could have it in an included file. You don't need to worry about adding a class to a specific menu item on each page. Having it in an include ensures that it's very easy to add new pages into the navigation structure.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
barking mad
Posts: 274
Joined: 12/6/2002
From: Out in the sticks, UK
Status: offline
|
RE: hyperlink colors - 8/21/2006 10:49:54
Thanks for your help ... but, I have to say I think you've lost me now!!
I give each page an id & include it in the body tag. OK
I then give each link an id & include in the a href tag. OK
Then you lose me ...
#home #nav-home, #contact #nav-contact (etc etc) {your rule goes here}
if I wanted the current page to be in bold what would the css code be? what's the '#' mean/for?
_____________________________
The more I ask, the more I learn, the more I' m confused, therefore the more I ask ...
| |
|
|
|
barking mad
Posts: 274
Joined: 12/6/2002
From: Out in the sticks, UK
Status: offline
|
RE: hyperlink colors - 8/21/2006 11:40:41
a little bit of tweaking and I got it to work!
thanks very much!
_____________________________
The more I ask, the more I learn, the more I' m confused, therefore the more I ask ...
| |
|
|
|
Tailslide
Posts: 6003
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline
|
RE: hyperlink colors - 8/21/2006 12:09:01
Sorry BM - popped away for a few minutes and didn't see your post. Glad you got it working.
(for others - the "#" refers to an id - in this case ids for the body and for the various nav items. e.g. #nav-home refers to the id given to the homepage link in the menu - nav-home. You can only use IDs once on each page btw).
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
