記事参照

No.3 2007/11/06 10:05
題:Re: オンマウスで文字色・枠内色の変更
名:Newのり太

> 最後に教えて頂いたサイトで挑戦してるのですが、リンクの文字色が青から
> 変えられないのですが・・・。
> クリックした後も、リンク色を変えずに、常に「枠内の色を赤」「文字を白」との
> 反転だけにしようと思えば、どうしたらよいのでしょう??
>> 文字色、背景色などはお好みで。
a.widelink { display: block; width: 100%; text-decoration: none; }
サンプルでは、文字の色や背景色は設定されていません。
ですので、↑に、お好みのスタイル(color: white; background-color: red; ですか)
を加えればよいかと。
# サンプルでは、「枠内の色」は、表のセルの属性で背景色を設定しちゃってます。
# せっかくスタイルシートを使ってるのになんだかな〜。って気がしないでもない。
>>> マウスがリンク上にある時、色を反転させたいのです。
a.widelink:hover { background-color: #ffff99; color: red; }
↑これがクラスwidelinkの「マウスがリンク上にある時」のスタイルです。
反転なら、color: red; background-color: white; ですね。

> ページ全体ではなく、この部分だけの設定のやり方を教えて戴ければと思います。
いや、ですから、そのようなサンプルを提示しています。
提示したサンプルでは、すべて(ページ全体ではなく)特定の箇所にのみ
スタイルを与えています。
上記サンプルも、クラスが"widelink"であるリンクのみにスタイルが適用されます。
その他のリンク部分は、特にスタイルを与えない限り、
ブラウザデフォルトのスタイルになります。

ホームページビルダーでのやり方は下記などが参考になるかと。
http://www.wsb.jp/hpb/css/link.htm#05
ただし、理屈がわかっていないとかえってややこしいかもしれません。
逆に、(HTMLと)スタイルシートの基本的なことがマスター出来れば
いろいろ応用が利くようになると思います。
http://www.kanzaki.com/docs/htminfo.html
# 適当な解説ページを捜せなかったんでド定番をはってみる。



掲示板に戻る