Setting Link Colours
Links are what you use to connect text and images within one of your pages to other pages on your site and other sites. You can also use links to provide for file downloads and to open your visitor's email program to allow them to send you an email. It is important therefore that the text links on your page be easily distinguished from the normal text that surround them. The easiest way of doing this is using different colours. Each web browser has default colours built in that it will use for links but these colours are not always appropriate given the colour scheme that you are using on your site. When this happens, you need to be able to set the link colours for yourself.
There are three or four different states that each link has. It has a normal state (before it is clicked on), an active state (when it is clicked on), a visited state (after it has been clicked on), and with internet explorer only a hover state (when the mouse passes over it). Each of these can have the colour set separately.
There are a number of ways that you can set the colours for your links. The easiest way to set the colours for the first three of these states for all of the links on a single page is to add the following three parameters the body statement in your page:
link="#ffffff" alink="#ffffff" vlink="#ffffff"
The #ffffff represents white using the standard html method of defining colours used in web pages where each two ff's represent red, green, and blue respectively and the hexadecimal number between 00 and ff (256) identifies the magnitude of that colour so ffffff = white 000000 = black, ff0000 = red, 00ff00 = green, 0000ff = blue and so on. A Non Dithered Colour Chart gives you the codes for 216 of these colours that will display properly even when your visitor has their screen set to use only 256 colours.
So with a site with a dark background (say its black) you might try say
<body bgcolor="#000000" link="#ffffff" alink="#ffff00" vlink="#c0c0c0">
This will give you white links that turn yellow when you click on them with links that you have already visited showing in silver.
As an alternative to including these parameters in the body statement you can set the colours using stylesheets. This can enable you to use a single statement to set all of the link colours on an entire site or set link colours for a single link. To set these colours just for your link instead of for the whole page just add style="color:#ffffff" within the <a> tag in your code. Just substitute the colour that you want to use where I put #ffffff.
To specify more than one colour for the links on your page you can put something like this in the head section of your page:
<style>
a:link {color:#ffffff;}
a:alink {color:#ffff00;}
a:vlink {color:#c0c0c0;}
a:hover {color:#00ff00;}
</STYLE>this allows you to set all four colours for all links on the page except those overridden by individual style parameters. In this case the colours are the same as above but when you hover your mouse over the link with Internet Explorer the link will turn light green.
To set the link colours for an entire web site place the style statements into a separate file and link it into each page using
<link rel="stylesheet" href="file.css" type="text/css">
where file.css is the name of the file containing the stylesheet commands. Note that you do not use <style> and </style> if you use an external file.
| Note: As an alternative to the #ffffff method of specifying colours, you can specify one of the following colours by name the majority of which are recognised by most browsers. aliceblue, antiquewhite, aqua, aquamarine, azure, beige, bisque, black, blanchedalmond, blue, blueviolet, brown, burlywood, cadetblue, chartreuse, chocolate, coral, cornflowerblue, cornsilk, crimson, cyan, darkblue, darkcyan, darkgoldenrod, darkgray, darkgreen, darkkhaki, darkmagenta, darkolivegreen, darkorange, darkorchid, darkred, darksalmon, darkseagreen, darkslateblue, darkslategray, darkturquoise, darkviolet, deeppink, deepskyblue, dimgray, dodgerblue, firebrick, floralwhite, forestgreen, fuchsia, gainsboro, gold, goldenrod, gray, green, greenyellow, honeydew, hotpink, indianred, indigo, ivory, khaki, lavendar, lavendarblush, lawngreen, lemonchiffon, lightblue, lightcoral, lightcyan, loghtgoldenrodyellow, lightgreen, lightgrey, lightpink, lightsalmon, lightseagreen, lightskyblue, lightslategray, lightsteelblue, lightyellow, lime, limegreen, linen, magenta, maroon, mediumaquamarine, mediumblue, mediumorchid, mediumpurple, mediumseagreen, mediumslateblue, mediumspringgreen, mediumturquoise, mediumvioletred, midnightblue, mintcream, mistyrose, moccasin, navajowhite, navy, oldlace, olive, olivedrab, orange, orangered, orchid, palegoldenrod, palegreen, paleturquoise, palevioletred, papayawhip, peachpuff, peru, pink, plum, powderblue, purple, red, rosybrown, royalblue, saddlebrown, salmon, sandybrown, seagreen, seashell, sienna, silver, skyblue, slateblue, snow, springgreen, steelblue, tan, teal, thistle, tomato, turquoise, violet, wheat, white, whitesmoke, yellow, yellowgreen. |
