リンクのスタイルや色を変える方法を紹介します。
スタイルシートの次の部分を編集します。スタイルシート上部にありスクロールしなくても見えるところにあるのですぐに見つけられると思います。
/************************************** ▼ リンクの色 ▼ */
a:link { color:
#000000; }
a:visited { color:
#000000; }
a:hover { color:
#000000; }
a:active { color:
#000000; }
/************************************** ▲ リンクの色 ▲ */
赤い部分の数値を変えてお好みの色にカスタマイズしてください。
また、リンクの下線を消したい場合は次の赤い文を加えます。
/************************************** ▼ リンクの色 ▼ */
a:link { color: #000000;
text-decoration:none; }
a:visited { color: #000000;
text-decoration:none; }
a:hover { color: #000000;
text-decoration:none; }
a:active { color: #000000;
text-decoration:none; }
/************************************** ▲ リンクの色 ▲ */
ちなみに4種類のリンクの意味は次のようになっています。
link 未訪のリンク
visited 訪問済みのリンク
hover カーソルが上に乗っているリンク
active アクティブ中のリンク
マウスカーソルを上に乗せたときだけ下線が出る、訪問済みは解かりやすく色を変える等、色々な使い方が出来ます。
お好みの色、スタイルにカスタマイズしてください。
< ここからは追記 (2006/08/09) >「text-decoration:」の後ろには次のようなものがあります。
none 下線は付きません。
underline テキストに下線が付きます。
overline テキストに上線が付きます。
line-through テキストに打ち消し線が付きます。
blink テキストが点滅します。
例えばカーソルが乗ったときだけ下線を付けたい場合は次のようになります。
/************************************** ▼ リンクの色 ▼ */
a:link { color: #000000;
text-decoration:none; }
a:visited { color: #000000;
text-decoration:none; }
a:hover { color: #000000;
text-decoration:underline; }
a:active { color: #000000;
text-decoration:none; }
/************************************** ▲ リンクの色 ▲ */
- 関連記事
-
こんな技術があって、すばらしいですね!
ときどき参考にさせていただきます。よろしく御願いいたします。