Changing 1 hyperlink colour - all links change?

Discussion in 'HTML & Website Design' started by gbg16, Apr 9, 2009.

0
  1. #1
    Currently my hyperlinks are orange on a black backgorund, however I want to change 1 hyperlink to blue, when ever I change it using front page, ALL links change to blue.

    SO can anyone tell me how to change the colour of 1 hyperlink that will not effect the other links?
     
    gbg16, Apr 9, 2009 IP
  2. htmlmaster

    htmlmaster Peon

    Messages:
    25
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    make the different css class for one link where you want use different color
     
    htmlmaster, Apr 9, 2009 IP
  3. imranzia

    imranzia Well-Known Member

    Messages:
    146
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    110
    #3
    you are trying to change in CSS style, if you want to make changes only in 1 link, you have to change colour code within the speciafic hyperlink code e.g. <a href=http://.... >
     
    imranzia, Apr 9, 2009 IP
  4. htmlmaster

    htmlmaster Peon

    Messages:
    25
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    yes your are right but in future if u need some more link like this then u cannot give color to link , easy way to do is to make the css class.
     
    htmlmaster, Apr 9, 2009 IP
  5. qazu

    qazu Well-Known Member

    Messages:
    1,834
    Likes Received:
    62
    Best Answers:
    0
    Trophy Points:
    165
    #5
    I'd go with htmlmaster's solution. Make a new class as in <a class="odd" href="http://...">link text</a> and then style the a.odd class in CSS with a.odd {color:green} or a.odd:link {color:green} of you want the link to look like the rest on hover and once visited.
    That way he can reuse a.odd on another link or on another page and change it quite easily if he wants a different color.
     
    qazu, Apr 9, 2009 IP
  6. Rikesh

    Rikesh Active Member

    Messages:
    139
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    63
    #6
    I agree. Creating a special CSS code for the link is the easiest thing to do to solve your problem
     
    Rikesh, Apr 9, 2009 IP
  7. bam

    bam Peon

    Messages:
    53
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    YOu have to specify a class ...
     
    bam, Apr 9, 2009 IP
  8. Coolzrock

    Coolzrock Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #8 
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style type="text/css">
a:link {
    color:#f00;
 }
#footerlink {
    color:#000;
 }
</style>

</head>
<body>

<ul>
<li><a href="#">link 1</a></li>
<li><a href="#">link 2</a></li>
<li><a href="http://www.example.com" id="footerlink">Google Link</a></li>
<li><a href="#">link 3</a></li>
</ul>

</body>
</html>
    HTML:
    I think this should work. You can change the id of it... :)
     
    Coolzrock, Apr 9, 2009 IP
  9. gbg16

    gbg16 Peon

    Messages:
    13
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #9
    thank you all for your fantastic contributions.
     
    gbg16, Apr 10, 2009 IP