|
|
mw1
regular
Reg'd: Wed
Posts: 388
|
|
I am trying to get my head around the attributes of the CSS selector a:hover ??
can this selector have more than one attribute assign to the colour of the text that it changes to when the cursor hovers over a link ??
I am looking at the homepage of web-user, and I thought that all the links when hovered over turned red. I presumed that therefore the attribute for the hover selector when hovered over must be set to change the text to red..
Why is it then that when you hover over reversed out type ( white type ) it changes to yellow ???
how can a selector therefore have more than one attribute set for the colour of type..
hope this makes sense.. as I am a complete novice to this HTML malarkey I am probably missing the obvious..( I hope )
hope someone can explain it in laymans terms
Thanks
M
XP Pro - Intel Celeron 1400MHz - 512MB of RAM - 40 GB HDD - Freeserve BB IE6+OE6.
|
|
TheFatControlleR
Forum Admin
Reg'd: Fri
Posts: 6554
Loc: Megatripolis
|
|
That CSS function usually comes in a set. See below for a sampler.
.headnav = the ordinary state for when the text is not a link.
.headnav a = the state for when the text is a link
.headnav a:hover = the state for when the text is a link and the cursor passes over it
.headnav {
background-color : #0052ac;
color : #c7ddf8;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : bold;
text-decoration : none;
}
.headnav a{
background-color : #0052ac;
color : yellow;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : bold;
text-decoration : none;
}
.headnav a:hover{
background-color : #0052ac;
color : #ff8c00;
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : bold;
text-decoration : none;
}
Here's how it looks. 
 TFC
Nothing is a problem for me... 
|
mw1
regular
Reg'd: Wed
Posts: 388
|
|
Hi TFC,
fanx for your sampler...
does explain why you can have more than 1 colour for a hover selector...
easy, if you know the right method .....
cheers
M
XP Pro - Intel Celeron 1400MHz - 512MB of RAM - 40 GB HDD - Freeserve BB IE6+OE6.
|
longplay
regular
Reg'd: Mon
Posts: 266
Loc: UK
|
|
AS TFC points out, you can assign different text and link colours to different areas of the page. All you need to do is put them in a div with an ID attribute, so you reference it.
So
#navbar a {
color: black;
}
#content a {
color: white;
}
a {
color: purple;
}
don't interfere with each other, any link which is contained within <div id="navbar"></div> tags is black, any links between <div id="content"></div> tags are white and any other links are purple.
The Digerati Peninsula
|
mw1
regular
Reg'd: Wed
Posts: 388
|
|
cheers Longplay,
I'll have a play with your code ( if you don't mind )
cheers
M
XP Pro - Intel Celeron 1400MHz - 512MB of RAM - 40 GB HDD - Freeserve BB IE6+OE6.
|
Previous
Index
Next
Threaded
Edit
Reply
Quote
