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 7 of 7
  1. #1
    Regular Coder
    Join Date
    May 2003
    Posts
    115
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Forcing Link Colors

    I have a page that the CSS style sheet a:link color is set to #000000 But there are many text links on the page that I would like to be a different color than the standar links. How can I change certain links to be what ever color I want, while still having all other text links #000000?

  • #2
    Regular Coder
    Join Date
    Jul 2004
    Location
    engoku no anime
    Posts
    354
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Please show us parts of your code that you want to be different.

  • #3
    Regular Coder
    Join Date
    May 2003
    Posts
    115
    Thanks
    1
    Thanked 0 Times in 0 Posts
    <A href="http://www.puc.edu/Albion/page2.html">Things
    to Do</A><font color="#000000"> |</font> <A href="http://www.puc.edu/Albion/page3.html">Facilities</A><font color="#000000"> |</font> <A href="http://www.puc.edu/Albion/page4.html">Seminar
    and Classes</A>

    Here is the code, I just want to change the color of the names, such as "Things to Do"

  • #4
    Senior Coder
    Join Date
    Jul 2004
    Location
    New Zealand
    Posts
    1,315
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Code:
    <a style="color:#f00">

  • #5
    Regular Coder
    Join Date
    Apr 2004
    Location
    Birmingham, MI
    Posts
    131
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Will they all be different colors, or will there be multiple links sharing the same color?

    It might be beneficial to use "classes". They are fairly easy to work with and are definetely the way to go if you want to assign custom styling to a few specific elements.

    HTML:
    Code:
    <a href="#" class="myClass">Link here</a>
    CSS:
    Code:
    a.myClass:link { color:#f00 }

  • #6
    Regular Coder
    Join Date
    May 2003
    Posts
    115
    Thanks
    1
    Thanked 0 Times in 0 Posts
    That works great, thanks so much!

  • #7
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The next step beyond using classes is to code your CSS to your page layout. For instance if you want links in the main content section of your page to be a certain color but links in the navigation area to have a different color you can do it using classes or by content.

    For example:

    Code:
    <div id="maincontent>...<a href="someplace">Some place</a>...</div>
    <div id="navigation">...<a href="anotherpagehere">Another Page Here</a>...</div>
    You can still style those links differently because the containing DIV tags provide the base information needed for styling via CSS:

    Code:
    #maincontent a:link { color: #f00; }
    #navigation a:link { color: #00f; }
    See the rule "#maincontent a:link" specifies that all "a" tags inside the element with the id of "maincontent" will be red while the similar rule for the id "navigation" specifies that links inside that element will be blue. This is an important thing to learn since it provides you with a way to avoid using classes when they are aren't needed and can make your html code even simpler which also makes it easier to maintain since you no longer have to worry about which "classes" should apply to a link. Instead the CSS rules which apply to a link are controlled by what are of the page the link will be found.

    IMO (In My Opinion), until you've understood this and started to use it you really haven't started to learn the real power of what CSS can do for you.
    Check out the Forum Search. It's the short path to getting great results from this forum.


  •  

    Posting Permissions

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