PDA

Click to See Complete Forum and Search --> : [RESOLVED] link effects for only one link

Tusserte
04-08-2006, 02:30 PM
i'm not sure what section this is under because i'm sure there are lots of ways to do this. i want color and underlining flips on mouseover with only a few links, and here's the code i use to do it:

<STYLE TYPE="text/css">
a:link { color: none; text-decoration: underlined }
a:active { color: none; text-decoration: underlined }
a:visited { color: none; text-decoration: underlined }
a:hover { color: none; text-decoration: none }
</STYLE>

for some reason, this code affects every link on my page instead of just the few i want. this happens no matter where i place the code. if possible, i would change the colors from 'none' but i don't want it happening to everything else. how do i do it? thanks!
Fang
04-08-2006, 02:43 PM
Give the ones that a to be changed a class
color:none; is not valid, so is ignored.
text-decoration: underlined; is the default, so need not be added.
The order of the pseudo classes is important (love hate)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<title>css anchor</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<style type="text/css">
a:link {}
a:visited {}
a.styled:hover {color:red; text-decoration: none }
a:active {}
</style>

</head>
<body>
<a href="http://www.google.com">xxxx</a>
<a class="styled" href="http://www.google.com">xxxx</a>
</body>
</html>http://www.w3schools.com/css/css_pseudo_classes.asp
Elghinn
04-10-2006, 06:12 AM
Im having the same problem. But I'm somewhat new at this and dont know much about css or anything, though I have used them before. Im the lead admin of a little forum and I used to know someone who knew how to make the admin names different colors. That person never told me how they did it, and now I'm trying to figure it out. My main guess is that it has to do with links because the names are links. Is there anyone who knows how to do this?
__sticky__
04-11-2006, 06:10 AM
i had this problem for a while also...until I discovered "class"

for your regular links do:
<style type="text/css">

a {
color: #4A9485;
font-weight: bold;
text-decoration: none;
}

a:hover {
color: #000000;
font-weight: bold;
text-decoration: underline;}



...and then for the ones you want different give them a "class" like this:



a.nav {
display: block;
padding-left: 3px;
padding-top: 3px;
margin-left:-5px; margin-right:-5px; margin-top:0px; margin-bottom:0px;
background-color: #CBFFBD;
border-bottom: 2px solid #ffffff;
border-right: 0px solid #ffffff;
color: #000000;
line-height: 13px;
font-weight: bold;}

a.nav:hover {
display: block;
padding-left: 3px;
margin-left:-5px; margin-right:-5px; margin-top:0px; margin-bottom:0px;
background-color: #DF8E00;
border-bottom: 2px solid #ffffff;
border-right: 0px solid #000000;
color: #ffffff;
line-height: 13px;
font-weight: bold;}
</style>

so when you want your special links to be displayed, type in this code:
<a href="blah" class="nav">blah</a> (dont forget to add class="nav")

and then your regular links, just type the regular code:
<a href="blah">blah</a>


....im new to explaining things, but I tried my best :)

also, you can name your class whatever you like...I just used "nav" because thats what I usedon my site...
Tusserte
04-11-2006, 11:54 AM
And if I wanted to have a few different classes, I could change all the parts that said 'nav' to whatever I wanted?
Elghinn
04-11-2006, 01:29 PM
its still not working for me...would someone mind taking a look at my thing and tell me what im doing wrong. you just have to register and and pm me on Ultra Anime Crazy (http://s15.invisionfree.com/Ultra_Anime_Crazy)
JPnyc
04-11-2006, 01:58 PM
And if I wanted to have a few different classes, I could change all the parts that said 'nav' to whatever I wanted?
Correct, but don't forget to put class="someClassName" inside the anchor tag.