Webデザイナーがリンクを設定していない場合、すべてのWebブラウザーはリンクの既定の色を使用します。彼らです:
- デフォルトのリンクカラー
- アクティブリンクの色(マウスをクリックしてリンク上に保持したとき)
- フォローされたリンクの色(以前リンクをクリックしたとき)
さらに、ほとんどのWebブラウザはデフォルトでこれを変更しませんが、ホバー色を定義することもできます。マウスの上にマウスを置いたときの色です。
CSSを使用してリンクの色を変更する
これらの色を変更するには、カスケードスタイルシートを使用します。リンクの色を変更する最も簡単な方法は、タグをスタイルすることです。
a {color:black; }
このCSSを使用すると、リンクの一部(アクティブ、フォロー、およびホバー)が黒に変わるブラウザや、デフォルトの色のみが変更されるブラウザがあります。
CSS擬似クラスを使用してリンクのすべての部分を変更する
擬似クラスは、クラス名の前にコロン(:)を付けてCSSで表現されます。 4つの擬似クラスがリンクに影響します。
デフォルトのリンクカラーを変更するには:
a:リンク{色:赤; }
アクティブな色を変更するには:
a:アクティブ{色:青; }
フォローリンクの色を変更するには:
a:訪問した{色:紫; }
マウスの色を変更するには:
考慮事項
デフォルトのリンクの色を上書きしないでください。リンクが見つけにくくなります。たとえば、リンクを白い背景に対して非常に明るい色に変更すると、視覚障害のあるビジターに悪影響を及ぼします。サイトの訪問者が訪問したページについて混同しないように、アクティブなカラーとフォローリンクの色を別々の色にすることをお勧めします。