Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Overuling a CSS command?

    Everytime I create links, it automatically turns to a specific color. How do I overule the color, I tried putting <font color="color">Link</font> in front of the link, but the color stays the same. I'm pretty sure it's cause of the CSS style sheet. is it possible to overule a CSS command for specific texts/links.

  • #2
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    To set the color of your links:

    Code:
    a:link, a:visited {
    color: #hex;
    background: #hex;
    }
    a:hover {
    color: #hex;
    background: #hex;
    }
    This is just an example, you'll have to find some colours you like and specify them where it says 'hex'. Also, don't use <font> tags, they were deprecated a long time ago.
    .
    .

  • #3
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Jutlander View Post
    To set the color of your links:

    Code:
    a:link, a:visited {
    color: #hex;
    background: #hex;
    }
    a:hover {
    color: #hex;
    background: #hex;
    }
    This is just an example, you'll have to find some colours you like and specify them where it says 'hex'. Also, don't use <font> tags, they were deprecated a long time ago.
    i know but i want a link different from the other ones, the link CSS color is black, which is find on my pages, but i have a link in my header, where the backgorund is grey, making the link very hard to see, how would i change the color of just that one link

  • #4
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,701
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    Assign an ID or class to that link and set the color in the CSS:
    Code:
    <a id="headerlink" href="#">link</a>
    
    
    #headerlink {color: lime;}

  • #5
    Regular Coder
    Join Date
    Jul 2007
    Location
    USA
    Posts
    146
    Thanks
    5
    Thanked 3 Times in 2 Posts
    Also if your CSS is external, you can over rule it by having some internal CSS in a specific part that will over rule it. So you keep the external the same and then the area of the links you'd like to make black are in the body lets say. Then make the internal CSS have the body make black links. That will over rule the external's power in the body section yet leave it in the rest. Hope that helps, if the above posts weren't what you'd like.
    Quote Originally Posted by rmedek View Post
    Doctordew, as soon as they come out with the opposite of an infraction, I am going to give you a million of them. You are my new favorite person on the forum.

  • #6
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    great thanks, now what is the CSS code to put if it's just text instead of a link

  • #7
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    You could make a class:

    CSS:

    Code:
    span.green {
    color: #090;
    }
    and then use that like this:

    HTML

    Code:
    <p>Blah blah blah <span class="green">this text will be green</span> blah blah blah</p>
    .
    .

  • #8
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    great, thx, +rep for everyone

  • #9
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,701
    Thanks
    6
    Thanked 1,011 Times in 984 Posts
    However, I would suggest using class names and IDs that represent the function of an element in the context, not it’s supposed look because this is going against the principles of modern web design which endorses the use of semantic code and also suggests to use CSS to style HTML. With the method suggested above this would be the opposite as it makes changes in the HTML necessary to apply a certain style, instead of just changing the CSS (i.e. to get another part of text green you’re more likely to go into the HTML and add an element with class “green” instead of going into the CSS and change the style of the element whose text is supposed to be green).

    And what happens if the color scheme is gonna change and the text is supposed to be red? You’ll have to change the CSS and the HTML if you wanna avoid confusion.

    So always name your elements according to their function, not their potential look. Looks can change but the function will stay the same. And if it’s only one occurrence which makes changes of the HTML necessary anyway then a simpe inline style will do it as well. That way you know where it is:
    Code:
    <p>lorem ipsum… <span style="color: green;">text</span> dolor sit amet.</p>

  • #10
    Regular Coder Jutlander's Avatar
    Join Date
    Jun 2007
    Location
    In my own sick little world :P
    Posts
    425
    Thanks
    1
    Thanked 12 Times in 12 Posts
    And as much as you believe you are right in what you say above (and I get your point, don't get me wrong), I'd say using inline style is still wrong, no matter if it's only one time. It goes against the whole thing with separating HTML from presentation.
    .
    .

  • #11
    New Coder
    Join Date
    Aug 2007
    Location
    Ontario, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    which method is better, in terms of loading time and compatibility


  •  

    Posting Permissions

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