Jump to content

Changing Link Colors


ChipChamp007
 Share

Recommended Posts

How do I change the color of text links so that you can see it, but with the picture links make all of the colors the same color as the background? Because at the moment the background of my page is black, and I am using this bit of CSS to make the colors of the links around the picture buttons black:a:link, a:visited, a:active { text-decoration: none; color: #000; }But, that makes all of the other text links also black, which makes them invisible. How can I make it so that all of the link colors are, for example, white, except for a certain td, and the links in that are black?Does this make any sense?EDIT: Here a little bit simpler. How would I make it so that inside td.buttons it would use the code above, and inside id.content it would use this code:a:link, a:visited, a:active { text-decoration: none; color: #ffffff; }???Also, I just noticed that this piece of code only seems to work in FF. (At least not in IE). What code do I use to make it do the same effect in IE?

Link to comment
Share on other sites

i think the best way is to show you a simple example:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head>	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />	<meta http-equiv="Content-Language" content="en-gb" /><title>This is a title</title><style>a{color:#FF0000;text-decoration:none;}a:hover{color:#00FFFF;text-decoration:underline;}#div a{color:#66FF00;text-decoration:underline;}#div a:hover{color:#666666;text-decoration:none;}</style></head><body><p>Some text..blah blah blah. <a href="">a link with no class or id. It shows up red, with no underline and when hovered over it is blue.</a></p><div id="div"><p>Some more text...blah blah blah.<a href="">This link is inside a div with id div, and has seperate colours.</a> </p></div></body></html>

Copy paste that into something, save it as a webpage (with .htm ending), and view on your computer.Hopefully you can work out whats happening. If you use classes, replace the '#' with a '.' in the style. You basically assign styles based on id's and classes's.Hope that helps a bit.

Link to comment
Share on other sites

Buttons can be changed by doing the following:
TD Input {	 color:#000;	 background-color:#FFF;	 border: 3px ridge #000;}

Where Input is the tag under TDs.

That would modify all inputs (text, radio, checkbox, buttons) inside of a td element. If you only want to modify button I suggest using a class.
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...