Welcome to TalkGraphics.com
Results 1 to 4 of 4
  1. #1
    Join Date
    May 2001
    Location
    Atlanta, Georgia, US
    Posts
    8

    Default

    I have a CSS question, and I've been searching around the web trying to find the answer or another site that does what I want so that I can look at their code, but I'm not having any luck. Now, I'm hoping that you guys might be able to help me. :-)

    I'm redoing my personal website, and I want each of the links to be a different color on mouseover, like "purpose" will change to yellow, "services" will be orange, etc. I know it sounds tacky but I think it's going to look nice. Anyway, I have an external style sheet, but I'm thinking that I need an inline style, too. The trouble is, I can't figure out what the a href tag should look like with an inline style. I would be very grateful if someone could either post sample code for a link tag with a:link and a:active styles or if someone could point me toward a website that does what I want to do so that I can look at their code.

    Thank you!!!
    Michelle
    IP

  2. #2
    Join Date
    May 2001
    Location
    Atlanta, Georgia, US
    Posts
    8

    Default

    I have a CSS question, and I've been searching around the web trying to find the answer or another site that does what I want so that I can look at their code, but I'm not having any luck. Now, I'm hoping that you guys might be able to help me. :-)

    I'm redoing my personal website, and I want each of the links to be a different color on mouseover, like "purpose" will change to yellow, "services" will be orange, etc. I know it sounds tacky but I think it's going to look nice. Anyway, I have an external style sheet, but I'm thinking that I need an inline style, too. The trouble is, I can't figure out what the a href tag should look like with an inline style. I would be very grateful if someone could either post sample code for a link tag with a:link and a:active styles or if someone could point me toward a website that does what I want to do so that I can look at their code.

    Thank you!!!
    Michelle
    IP

  3. #3
    Join Date
    Aug 2000
    Location
    Ingolstadt, Germany
    Posts
    358

    Default

    <blockquote>like "purpose" will change to yellow, "services" will be orange, etc.</blockquote>

    Use ID selectors to tell the different links apart. eg. CSS:</p><blockquote><code>#purpose:hover { color: yellow }</code></blockquote>

    HTML:</p><blockquote><code><a href="purpose.html" id="purpose">Purpose</a></code></blockquote>

    Won't work on Netscape 4, which doesn't understand 'hover' (and can only do rollovers with JavaScript and images), but it's fine on IE, Mozilla and Opera.</p>
    IP

  4. #4
    Join Date
    May 2001
    Location
    Atlanta, Georgia, US
    Posts
    8

    Default

    Thanks Andrew! I was just coming back to post a message saying that I had figured out how to do it when I saw your message - thanks for taking the time to reply!

    I figured it out with help from the css faq at http://css.nu/faq/ciwas-aFAQ.html and what I did was very similar to what you suggested. Here is a small sample of my code:

    In the style sheet I put
    a.purpose:hover { color: #ffff33; text-decoration: none}
    a.purpose:active { color: #ffff99; text-decoration: none}

    and then in the html I have
    < a class="purpose" href="purpose.html" >

    If you'd like to see it, my url is http://michelleswebdesigns.com

    Thanks!
    Michelle
    IP

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •