cssでタブメニューのhoverとavtive

質問

いつもお知恵拝借、ありがとうございますm(_ _)m

ごく最近、cssを勉強し始めたばかりの超・初心者です。タブメニューを作っているのですが、

#cell2 :hover,#cell2 a:active {
background-image:url(tab.gif);
}

として、ポインタがメニューの上に来た時と、クリックしてそのページへ飛んだときの背景を「tab.gif」に設定しました。

hoverの時は、ちゃんと背景が「tab.gif」になるのですが、リンク先のページに飛んだとき(そのページも全く同じタブメニューがある)に、activeで背景が「tab.gif」にならないのです。

何か基本的な知識不足ではないかと思うのですが、どうかご教授の程よろしくお願いしますm(_ _)m

ソフトはwin xp+Homepage Builder10です。

回答No.4

CHI-512 · ベストアンサー

こんにちは。
:activeはマウスでその領域をクリックした時の動作になりますので、クリックしてそのページに飛んだ時の動作を指定することは出来ません。:activeの動作はページ移動・マウスを他でクリックで消えます。
ちなみに、:hoverはマウスがその領域に乗った時の動作です。

ページごとにメニューの該当するメニュー名の背景・画像を変えたいのであれば、そのページごとに背景（もしくは画像）を指定するのが一番簡単です。
あとはJavaScriptやCSSでも方法があるかもしれません。

補足

ご回答、ありがとうございますm(_ _)m

＞ページごとにメニューの該当するメニュー名の背景・画像を変えたいのであれば、そのページごとに背景（もしくは画像）を指定するのが一番簡単です。

はい、とりあえず次善の策としてそのようにやってみて、ＯＫでした。ただ、何かもっと“洒落た”やり方がcssにないものかと考えたものですから、質問を出してみたところです。

＞あとはJavaScriptやCSSでも方法があるかもしれません

もし思い出すようなことがあれば、是非ご紹介下さいm(_ _)m

回答No.3

naokita

#2ですが、

ローカル表示の場合、飛び先のページを上書き保存して再確認は？
当然、公開する場合も・・・

補足

＞ローカル表示の場合、飛び先のページを上書き保存して再確認は？

「再確認」というのは、変更後のプレビューのことでしょうか？もしそうなら、もちろんプレビューしています。

説明不足のようでしたから補足しますが、このようなタブメニューにしようと思ったのは、全ページ共通してページ下部に同じタブメニューを作り、現在訪問中のページのタブの色(背景)を他のタブと変えようとするものです。

時々サイトで見かけるものですから、真似しようと思ったのですが・・・。

回答No.2

naokita

何をどうするのか不明ですが、
飛んだ先のメニューの背景なら
a:active　では無く　a:visited　の間違いでは？

補足

ご回答、ありがとうございますm(_ _)m

＞a:visited　の間違いでは？

a:visited　とすると、また別のページに飛んだあとも、訪問済みのページということで、背景が「tab.gif」のまま残るんじゃないかと思うんですが・・・。

回答No.1

noname#39970

飛んだ先で　設定したCSSを読み込んでいないまたはCSSが書かれていない或いは飛んだ事で画像へのURLが変わってしまった

のどれかと予想

補足

さっそくのご回答、ありがとうございますm(_ _)m

＞飛んだ先で　設定したCSSを読み込んでいないまたはCSSが書かれていない

飛んだ先のcssは、もとのページと同じで、
<link rel="stylesheet" type="text/css" href="style_k.css"/>
です。また、飛んだ先のページでのhoverは、もとのページと同じくちゃんと働いています。

＞或いは飛んだ事で画像へのURLが変わってしまった

とのことですが、同じフォルダーなので、同じでいいのではないかと思ったのですが・・・。

お手数をお掛けしますが、なにとぞよろしくお願いします。