SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Member
    Join Date
    Apr 2006
    Location
    India
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Lightbulb Problem in Hover,Link ,Active,Visited

    Hello ,

    I have design website in the Microsoft Expression .Now i want to add css class for different effect of link.. like a:hover ,a:link ,a:active,a:visited.

    when i apply direct a:hover ,a:link ,a:active,a:visited in my style so it will show effect..

    But When i use class for different effect like this but it not shown any effect...i use style sheet inbuilt in page...

    a.temp:active {
    font-family: verdana;
    font-size: small;
    color: #FFFFFF;
    text-decoration: none;
    }
    a:temp:hover {
    font-family: Verdana;
    color: #FFFF00;
    text-decoration: underline;
    font-size: small;
    }

    and i write class like this : class="style10,temp"
    style10 is my other class for other formating...


    Pls help me what can i do ??? i am very tired to find its solution ..

  2. #2
    SitePoint Wizard rbutler's Avatar
    Join Date
    Jul 2003
    Location
    Springfield, MO
    Posts
    1,867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    First, write the additional pseudo-states:

    Code:
    a:temp:link {
    font-family: Verdana;
    color: #FFFF00;
    text-decoration: underline;
    font-size: small;
    }
    a:temp:visited {
    font-family: Verdana;
    color: #FFFF00;
    text-decoration: underline;
    font-size: small;
    }
    a:temp:hover {
    font-family: Verdana;
    color: #FFFF00;
    text-decoration: underline;
    font-size: small;
    }
    a.temp:active {
    font-family: verdana;
    font-size: small;
    color: #FFFFFF;
    text-decoration: none;
    }
    Then in HTML:

    Code:
     
    <a href="somepage.html" class="temp">My link</a>
    Ryan Butler

    Midwest Web Design

  3. #3
    SitePoint Member
    Join Date
    Apr 2006
    Location
    India
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks

    Now it Works,

    But actually i have <td class="style10"> where i apply temp class of css...

  4. #4
    SitePoint Addict CaryD's Avatar
    Join Date
    Nov 2006
    Location
    San Diego, CA
    Posts
    389
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I believe you would use

    HTML Code:
    <td class="style10">
    <a href="somepage.html" class="temp">My link</a>
    </td>
    If you want two classes together you could use this, for instance:

    Code:
    class="style10 temp"
    But applying style10 to a is not the same of course as applying it to td.

  5. #5
    SitePoint Member
    Join Date
    Apr 2006
    Location
    India
    Posts
    20
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Dude

  6. #6
    SQL Consultant gold trophysilver trophybronze trophy
    r937's Avatar
    Join Date
    Jul 2002
    Location
    Toronto, Canada
    Posts
    39,251
    Mentioned
    59 Post(s)
    Tagged
    3 Thread(s)
    i hope you realize that a:temp:hover is invalid, it should be a.temp:hover
    rudy.ca | @rudydotca
    Buy my SitePoint book: Simply SQL
    "giving out my real stuffs"

  7. #7
    SitePoint Wizard rbutler's Avatar
    Join Date
    Jul 2003
    Location
    Springfield, MO
    Posts
    1,867
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, I copied and pasted the code quickly. I sometimes assume a certain level of competency of people on these forums, that perhaps, I shouldn't assume.
    Ryan Butler

    Midwest Web Design


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
  •