SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2000
    Posts
    53
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS include link color?

    I am just beggining to implement CSS (btw it actually does reduce file size pretty well) but I wanted to know how to specify link color. For example I have the following

    .mainwhite { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; color: #FFFFFF}

    I wanted it to also specify the link color for any links within that class (I think class is the name for that correct me if I'm wrong). what would I add to do that. You CAN do that right?

  2. #2
    SitePoint Evangelist pip's Avatar
    Join Date
    Jun 2001
    Location
    Cape Town, South Africa
    Posts
    548
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Place an "A" infront as follow:

    A.mainwhite { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; color: #FFFFFF}

    You would have to specify your anchors as follow, in this case.

    <A HREF="" CLASS="mainwhite"></A>

    Not sure if this answered the question. Hope it helps
    - Pip
    ---------------------------------------------------------------------------------
    Nothing takes the taste out of peanut butter quite like unrequited love.

  3. #3
    Captain Internet neil's Avatar
    Join Date
    Jun 2001
    Location
    n.ireland
    Posts
    333
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    a:link { text-decoration: none; color: #FFFFFF; }

    or for the visited link
    a:visited { text-decoration: none; color: #FFFFFF; }

  4. #4
    The Hiding One lynlimz's Avatar
    Join Date
    Jul 2000
    Location
    Singapore
    Posts
    2,103
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    to specify a color, all you have to do is set the color attribute, like this.

    color : #000000;

    then you add your class to your link.

    <a class="XXX">

    you can also set the default links, like this.

    a { color : #000000; }

    and all anchor links will be black in color.
    "Imagination is more important than knowledge. Knowledge is limited. Imagination encircles the world."
    -- Albert Einstein

  5. #5
    SitePoint Enthusiast ben_washington's Avatar
    Join Date
    Jun 2001
    Location
    New Zealand
    Posts
    34
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can also make the text change color when the mouse rolls over it, just use "hover":

    a:link{color:#000000;}
    a:hover{color:#ff0000;}

    Hope thats some help to you

  6. #6
    Victory shall be mine tubedogg's Avatar
    Join Date
    Mar 2001
    Location
    Medina, OH
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    One other thing - assuming you are using some type of <div> or <span> to define certain text as .mainwhite, you could just do the following.

    #mainwhite { font-family: Arial, Helvetica, sans-serif; font-size: 10pt; font-weight: bold; color: #FFFFFF; }
    #mainwhite A:link{ color:#000000; }
    #mainwhite A:visited{ color:#ff0000; }
    #mainwhite A:active{ color:#000000; }
    #mainwhite A:hover{ color:#ff0000; }


    Then in your document it would apply it to any links in the specified area, such as:

    <div class="mainwhite">My text. <a href="mylink.com">My Link</a>.</div>
    or
    <span class="mainwhite">text and links</span>
    Last edited by tubedogg; Jul 8, 2001 at 08:01.
    Kevin

  7. #7
    SitePoint Zealot thespian's Avatar
    Join Date
    Sep 2000
    Location
    South Africa
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by tubedogg
    ... assuming you are using some type of <div> or <span> to define certain text ...
    Kevin,

    Leading on from your previous example - I use <span> regularly to define those "One-Off" instances where I do not want to create a new class and clutter up my stylesheet unnecessarily.

    For example -

    <span style="color:#990000;">This is RED text</span>

    What I would like to know is how do I go about setting the style properties of a link (visited, hover, etc.) within such an example? In other words, is it possible to do without first having to define a class (like "mainwhite" in your example)?

    Thanx for reading.
    Bill Conté [Protected by Psalm 91]
    Web Mechanix
    Growing OLD is Mandatory - Growing UP is Optional!

  8. #8
    Victory shall be mine tubedogg's Avatar
    Join Date
    Mar 2001
    Location
    Medina, OH
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't believe so, at least not defining hover, etc. You could define one constant color, but other than that you'd have to use classes.
    Kevin

  9. #9
    :) delemtri's Avatar
    Join Date
    Jun 2001
    Posts
    579
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Can't you just use <font color="#990000">This is RED text</font>

  10. #10
    Victory shall be mine tubedogg's Avatar
    Join Date
    Mar 2001
    Location
    Medina, OH
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As thespian stated, he wanted to color links. That would not color links.
    Kevin

  11. #11
    SitePoint Zealot thespian's Avatar
    Join Date
    Sep 2000
    Location
    South Africa
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by tubedogg
    I don't believe so, at least not defining hover, etc. You could define one constant color, but other than that you'd have to use classes.
    That's what I thought (although I was hoping ... )!

    Thanx for the info.
    Bill Conté [Protected by Psalm 91]
    Web Mechanix
    Growing OLD is Mandatory - Growing UP is Optional!


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
  •