dudaweisf Posted January 1, 2013 Share Posted January 1, 2013 (edited) I have a few web pages with weblinks that actually requires different colored fonts for different types of links.If it was possible to create <a1> <a2> <a3> tags (instead of the usual <a>) to create CSS links with a pre-defined colored fonts in the head page I would use it. But as it is now (with this specific kind of page that I'm building), not designating font color inline could bring a lot of headaches. Is this a case where I should just ignore the fact that font color done inline is depreciated, or are the actually benefits to going to the trouble of designating font color in the head CSS worth it? What are the benefits? The extra amount of writing (which in this case really isn't any more then copy and paste) seems well worth it considering the amount speed that problems can get troubleshooted inline. Edited January 1, 2013 by dudaweisf Link to comment Share on other sites More sharing options...
Bule Posted January 1, 2013 Share Posted January 1, 2013 You can do this: <html><head><style>a.redclass:link {color:orange;}a.greenclass:link {color:green}</style></head><body><a href="example.com">normal color</a></br /><a class="redclass" href="example.com">red color</a></br /><a class="greenclass" href="example.com">blue color</a></br /></body></html> Link to comment Share on other sites More sharing options...
Bule Posted January 1, 2013 Share Posted January 1, 2013 and, if you wish to add color in-line (rather that refer to the style sheet) <a style"color:red" href="link">this link is red</a> Link to comment Share on other sites More sharing options...
dsonesuk Posted January 1, 2013 Share Posted January 1, 2013 with css3 you can target attribute value, but this won't work for older browser versions a[href*="red.com"] {color:red;}a[href*="blue.com"] {color:blue;} Link to comment Share on other sites More sharing options...
dudaweisf Posted January 2, 2013 Author Share Posted January 2, 2013 Works great, thanks, now I just have to figure out how to disable the hoover function, which changes its color after the link has been accessed. (Its a pre-made template) Link to comment Share on other sites More sharing options...
Labtec Posted January 2, 2013 Share Posted January 2, 2013 (edited) Inside your CSS file, use your text editors 'Find' function and search for: "a:hover". Just completely delete that and it will stay the same color when you hover over it. Although without seeing the CSS, I hard to be accurate. If you post your CSS file, I'll identify the area you need to delete. Regards, Lab. Edited January 2, 2013 by Labtec Link to comment Share on other sites More sharing options...
jlhaslip Posted January 2, 2013 Share Posted January 2, 2013 Alternately, simply apply the same CSS to the :hover state as the non-hover state and it will not change colour.Personally, I would simply comment out the existing :hover CSS in case you needed it back some day. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now