IT Community - Software Programming, Web Development and Technical Support

How can I have two sets of links with different colors?

This is a discussion on How can I have two sets of links with different colors? within the HTML, CSS and Javascript Coding Techniques forums, part of the Web Development category; How can I have two sets of links with different colors?...


Go Back   IT Community - Software Programming, Web Development and Technical Support > Web Development > HTML, CSS and Javascript Coding Techniques

Register FAQ Members List Calendar Mark Forums Read
  #1  
Old 07-27-2007, 02:12 AM
oxygen oxygen is offline
D-Web Architect
 
Join Date: Jun 2007
Posts: 632
oxygen is on a distinguished road
Question How can I have two sets of links with different colors?

How can I have two sets of links with different colors?
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
  #2  
Old 07-27-2007, 02:43 AM
kingmaker kingmaker is offline
D-Web Genius
 
Join Date: Jun 2007
Posts: 881
kingmaker is on a distinguished road
Send a message via MSN to kingmaker
Default Re: How can I have two sets of links with different colors?

You can suggest this presentation in a style sheet. First, specify colors for normal links, like this:

a:link {color: blue; background: white}
a:visited {color: purple; background: white}
a:active {color: red; background: white}

Next, identify the links that you want to have different colors. You can use the CLASS attribute in your HTML, like this:

<a class="example1" href="[url]">[link text]</a>
Then, in your style sheet, use a selector for links with this CLASS attribute, like this:

a.example1:link {color: yellow; background: black}
a.example1:visited {color: white; background: black}
a.example1:active {color: red; background: black}

Alternatively, you can identify an element that contains the links that you want to have different colors, like this:

<div class="example2">...
<a href="[url]">[link text]</a>...
<a href="[url]">[link text]</a>...
<a href="[url]">[link text]</a>...
</div>

Then, in your style sheet, use a selector for links in this containing element, like this:

.example2 a:link {color: yellow; background: black}
.example2 a:visited {color: white; background: black}
.example2 a:active {color: red; background: black}
Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!
Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off

Similar Threads
Thread Thread Starter Forum Replies Last Post
MySQL supports indian language character sets priyan Database Support 17 01-11-2010 12:25 AM
Manipulating scrollbar colors using CSS and JavaScript santhakumar HTML, CSS and Javascript Coding Techniques 1 11-27-2007 05:55 AM
Find similar Colors Balasubramanian.S C# Programming 2 09-19-2007 08:40 AM
Why the colors on my page look different when viewed on a Mac and a PC? oxygen HTML, CSS and Javascript Coding Techniques 1 07-27-2007 02:57 AM
Colors and fonts sanray316 Web Design Help 4 03-25-2007 09:29 PM


All times are GMT -7. The time now is 04:15 AM.


Copyright ©2004 - 2007, DiscussWeb. All Rights Reserved.
Our Partners
One Way Moving Companies | Stamford Dentist | Euro Millions Lottery | Home Loans| Furniture

SEO by vBSEO 3.0.0