動的といっても、マウスがリンク文字の上に来たときに限ります。
このブログもそうですが、リンク文字の上にマウスが来ると、文字に下線が付くと思います。
ページの基本的なデザインは維持したいけど、出来ればリンクは目立たせたい、と思ってやっています。
結局マウスを重ねないと分からないという点では、不十分なのですが・・・
さて、その設定方法ですが、スタイルシートに設定します。
スタイルシートに下記記述を追加します。
a:hover {
text-decoration:underline;
}
a:hover が、マウスがリンク文字の上に来たときに有効になる設定で、
text-decoration:underline; が、文字に下線を付ける設定になります。
ですので、{}の中に他の設定を追加すれば、他の装飾も可能です。
例.
背景色を出す:background-color:色のコード;
文字色を変更:color:色のコード;
例えば、このサイトは、
・リンク色が#2E70A4
・背景が#E6EAEE
ですが、リンクにマウスが重なったときに、
・リンク色を#E6EAEE
・文字の背景を#2E70A4
・かつ下線を付ける
にしたい場合(要は反転ですね)
a:hover {
color:#E6EAEE;
background-color:#2E70A4;
text-decoration:underline;
}
この設定を追加すればOKです。
こうなります
関連記事
・アンカー
・リンクには下線を
・リンクへの下線の付け方
コメントありがとうございました!
とっても嬉しかったです。
まだ、多くの方と交流していないため、
これから、ドンドン頑張りたいです。
ブログの知識がゼロに近いので、
あんな事に悩むのですが・・・。
これから、宜しくお願い致します。
よろしければ、相互リンクお願いいたします!こちらは、先に貼らせて頂きます♪
コメントありがとうございます。
私もいろいろな方のブログにお邪魔して、交流し始めているところです。
大変なこともありますが、がんばって行きたいですね!
こちらもリンク設置した。
トップページの右になります。