0

うまくいけば、これはばかげた質問ではありませんが、これを行う方法がわかりません。スタイルがすべてのクラスに適用されるように、アンカーのホバー/フォーカスにワイルドカードを適用できますか?

何かのようなもの

a:hover * { color: #ff0000; }

私が持っていると言う

a { color: #DD0000; }
a.link { color: #ffffff; }
a.link2 { color: #000000; }
a.user { ...
a.anything { ...

私が探しているものを説明する最も簡単な方法は、グローバルな :hover スタイルを使用することですが、複数の :link スタイルを使用することです。ありがとう

4

3 に答える 3

3

これを行うにはいくつかの方法があります。他の人が述べているように、次のように同じスタイルを複数のクラスに適用できます。

div a.class1:hover, div a.class2:hover, div a.class3:hover { ... }

適用するスタイル専用のカスタムクラスを作成することもできます。

div a.customClass:hover { ... }

*質問で述べたように使用できますが、ホバーを適用してください:

div *:hover { ... }

このオプションもあります。aこのオプションについてはすでにご存知でしょうが、すべてのスタイルを適用するだけです。

a:hover { ... }

編集:スタイルが他の何かによって「上書き」されている場合、すばやく簡単に確認する方法は、ブラウザの開発者ツールを使用して要素を検査することです。:hoverChromeとFirefoxに含まれている開発ツールを使用して疑似クラスを適用することもできます(つまり、要素にカーソルを合わせていない場合でも疑似クラスを適用します)(Firefoxでこれを行うにはFirebugをダウンロードする必要がある場合があります)。

別のオプションは!important、セレクターの特異性を高めるために使用することです。例えば:

a:hover { background: red !important; }

特異性の計算方法について詳しくは、こちらをご覧ください。

于 2012-07-03T19:05:53.080 に答える
1

特定のタグにグローバル CSS ルールを適用する場合は、次のように記述します (アンカー用):

a:link{/*your styles go here*/}
a:hover{/*your styles go here*/}
a:active{/*your styles go here*/}
a:visited{/*your styles go here*/}

別の方法でスタイルを設定した特別なリンクが必要な場合 (ボタンにするなど)、それにクラスを適用してクラスのスタイルを設定するだけです。

a.customlink{/*your styles go here*/}

編集: ホバー時にリンクの一部のプロパティのみを変更する場合、これらは 2 つの異なるリンクで同じになります (たとえば、一方が黄色で、もう一方が赤色の背景であり、両方を黒色にしたいとします)。バックグラウンド)、別の同じクラスを 2 つのリンクに追加し、スタイルを設定します。

JsFiddle の例

于 2012-07-03T19:02:28.550 に答える
0

次のようにコンマで区切ることができますa:hover link, a:hover link2, a:hover etc { color: #ff0000; }

a:hover { color: #ff0000; }あなたがしたいことをしませんか?

于 2012-07-03T19:00:40.520 に答える