a:hover couleur ne fonctionne pas

une chose très étrange..

Je veux changer la couleur du texte et de l'arrière-plan de couleur des liens lors de son survol.

c'est le code

css:

#link-menu a
{
    color:white;
    display:block;
    height:100%;
    width: 100%;
    text-decoration:none;
    text-align:center;
    line-height:45px;
    font-weight:bold;
    font-family:"trebuchet ms","comic sans ms";
    outline:none;
}

.link2 a:hover 
{
    color:black;
    background:white;
}

ce n'est pas que le hover ne fonctionne pas. la couleur de fond est en train de changer, mais la couleur du texte n'est pas en train de changer.

l'une de plus importantes fait est que si, au lieu de l'utilisation de la classe .link2 , j'utilise un id, la couleur change également.
Le problème est avec l'aide de la classe seulement.
Quelqu'un peut-il expliquer la raison et la solution?

Remarque: je ne veux pas utiliser l'élément parent de l'id. parce que je ne veux pas modifier l'arrière-plan de tous les liens.

Vous pouvez poster votre HTML?
a:hover doit venir APRÈS a:link et a:visited.
quoi? "a:link et a:visited" ???
Si il utilise a:link et a:visited, il doit placer a:hover au-dessous d'eux dans la feuille de style de sorte qu'il peut être efficace.
ok.....................

OriginalL'auteur Aman Gupta | 2013-06-06

  1. 17

    Son un la spécificité question; votre premier sélecteur est remplacer le second parce qu'il a une identité. Votre seule option est d'utiliser un !important règle ou dont le parent comme un ancêtre dans votre deuxième sélecteur de sorte que son plus spécifiques, par exemple

    #link-menu a:hover {
    background: white;
    color: black;
}
    merci beaucoup!! son travail maintenant...
    merci beaucoup!! son travail maintenant... vous avez eu raison sur les deux méthodes!
    Vous êtes les bienvenus! Regardez le lien que j'ai fourni pour une meilleure compréhension
    Vous devez cochez la réponse correcte afin que d'autres puissent se référer à l'avenir

    OriginalL'auteur Adrift

  2. 6
    #link-menu a

    A une plus grande priorité. Vous avez besoin d'augmenter la priorité de la deuxième sélecteur. Essayez d'ajouter !important

    .link2 a:hover 
{
    color:black !important;
    background:white;
}

    OriginalL'auteur Erlik

  3. 5

    #link-menu a est plus spécifique que .link2 a:hover, parce que le premier comprend un ID et le second ne l'est pas.

    Par conséquent, il remplace les propriétés dans la deuxième règle.

    Pour résoudre ce problème, modifiez-les de sorte qu'ils ont tous deux la même spécificité (avant le :hover), ou ajouter !important.

    OriginalL'auteur SLaks