3 Replies Latest reply on Mar 9, 2010 10:20 AM by Zabeth69

    a:link, same page, different colors?

    KevinSFreeman Level 1

      Does anyone know if it is possible to have links on the same page appear with different styling; colors, etc? I am placing a link over a photo and it blends into the photo, elsewhere on the page there is plenty of contrast. I have tried adjusting the a:link color to work with both backgrounds but it isn't perfect. Thanks for any help

        • 1. Re: a:link, same page, different colors?
          370H55V Level 4

          I have seen some pages with a style (image:a) that differentiates linked images from other hyperlinks.


          As for text, you can create several different styles and just tag individual links with the one you want to use.

          1 person found this helpful
          • 2. Re: a:link, same page, different colors?
            KevinSFreeman Level 1

            I got it... just add a class


            .different_linkcolor a:link a:link {
                color: #000;
                text-decoration: underline;


            connect it to your div and it works perfect




            • 3. Re: a:link, same page, different colors?
              Zabeth69 Level 5

              If you are consistent in where you want those "different" link colors to appear, for instance, always in the sidebar or always in the footer

              , you can use the ID of the sidebar or the footer to make contextual rules:


              a:link, a:visited {color: red;}

              a:hover, a:active {color: pink;}


              #sidebar a:link, #sidebar a:visited {color: blue;}

              #sidebar a:hover, #sidebar a:active {color: green;}


              #footer a:link, #footer a:visited {color: black;}

              #footer a:hover, #footer a:active {color: gray;}


              The nice thing about this method is that you don't have to remember where you put all those extra classes and as long as you consistently ID your sidebar and your footer (or any other container!), your styles will apply naturally and appropriately.


              Be sure you add the "amended" styles BELOW the original styles on the stylesheet, or they will get overridden.