アンカータグの指定

a:link a:visited a:active a:hover

未訪問のリンク 訪問済みリンク 訪問中のリンク マウスがリンクに乗っている

このaタグの擬似クラスを使ってリンクの色などを変更する事が出来ます。
例えばこのページは下のように指定してあります。

a:link
{text-decoration:none;
color:#ffa000;}
a:visited
{text-decoration:none;
color:#ffa000;}
a:hover
{color:#ff8888}
a:active
{text-decoration:none;
color:#ffa000;}

グループ単位でリンクの色を変える

メニューは青、その他はピンクなど、同一ページでリンクの色を変更する事も出来ます。
太い文字になっている部分が擬似クラスのクラス指定です。

a.pink:link
{text-decoration:none;
color:#ff6666;}
a.pink:visited
{text-decoration:none;
color:#ff8888;}
a.pink:hover
{color:#ff0080}
a.pink:active
{text-decoration:none;
color:#ff8888;}

Challenge HP　クラスpinkで色を変更
<:a href="http://www.marinenet.co.jp/you_style/hp/" class="pink">Challenge HP</a>

a:hover の色々なアクション

リンクにマウスが乗った時のアクションは、一般的にCSSの a:hover を使います。
a:hover に属性を付ける事でちょっとした仕掛けが出来ます。

Challenge HP　色が変ってアンダーライン
a:hover {text-decoration:underline;color:000000}

Challenge HP　色が変って背景にも色を付ける
a:hover {background-color:ffcc00;color:770000;}

Challenge HP　少しずれて色も変る
a:hover {color:ff9900;margin-top:2px;position:relative;top:2px;left:2px;}

Challenge HP　色が変ってサイズも変わる
a:hover {color:008800;font-size:16px;}

Challenge HP　色が変って太文字になる
a:hover {color:0088ff;font-weight:bold;}

リンクにマウスが乗ると何かしらのアクションがあった方が、そこにリンクが埋めて
ある事が分るので良いです。カーソルが手の形になるので、リンクが埋まっている事は分りますけどね。