- ベストアンサー
アンカーにクラスを適用しての擬似クラスの記述の仕方について
すみません、質問させてください。 アンカーにidを適用して <a id="abc">テスト</a> cssに下記のような記述でマウスオーバーでの変化させていたのんですが、 a#abc {} a:hover#abc {} アンカーにidではなくclassを適用して <a class="abc">テスト</a> a.abc {} a:hover.abc {} のように記述しましたところ、ポインタがおかしいです。IE6以外では、色を変えたりすることは可能でしたが、ポインタが指差しマーク状態になりません。 どなたか解決する方法をご教授ください。よろしくお願いします。
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (3)
- salonpath
- ベストアンサー率48% (194/399)
><a class="abc" href"#">テスト</a>でした。 <a class="abc" href="#">を <a href="#" class="abc">に たぶん基本は a href それ以降にidやclassやtargetです。 ■css <style> a:link, a:hover.abc { color:#ff3333; } a.abc, a:hover { color:#66CC00; } a:hover#abc { color:#00CCFF; } </style> ■html <body> <ul> <li><a href="#" class="abc">a href class｜classあり</a></li> <li><a href="#">a href｜classなし</a></li> </ul> <ul> <li><a class="abc">a class｜hrefなし</a></li> <li><a>a のみ</a></li> </ul> <ul> <li><a class="abc" href"#">a class href</a></li> <li><a id="abc" href"#">a id href</a></li> </ul> </body>
お礼
ありがとうございます。 href="#"が抜けているのに先ほど気づいたところでした。参考にさせていただきます。
これのほうが、解りやすいです。 <p id="abc"><a>テスト</a></p> #abd a:link,#abc a:visisted { *** } #abd a:link:hover,#abc a:visisted:hover { *** } これに対して........... <a class="abc">テスト</a> なら・・ #abd:link,#abc:visisted { *** } #abd:link:hover,#abc:visisted:hover { *** } となりませんか？
お礼
ありがとうございます。<p>を親要素？にして試行錯誤していたのですが、下記のようにhrefが抜けていたためでした。
お礼
ありがとうございます、書き間違えました。 <a class="abc" href"#">テスト</a>でした。
補足
すみません、よく確認したら、hrefがぬけていました。 ありがとうございました。