CSS3 deaktivieren Hover-Effekt selektiv

Question

Ich habe eine nicht nummerierte Liste mit mehreren Elementen - einige Elemente sind "Überschriften", die meisten Elemente sind Links.

Derzeit habe ich folgende CSS für meine Liste:

#result-side-menu li:hover { 
    background-color: rgba(0,0,0,0.15); 
} 

ich den Hover deaktivieren nur auf die Überschrift Listenelemente in der Lage sein wollen, während es auf allen anderen zu halten. Meine beste (und immer noch erfolglos) versucht, so weit war, dies zu tun:

#result-side-menu.li-no-hover li:hover { 
    background-color: none; 
} 

und dann die class="li-no-hover" auf die Überschrift Listenelemente anzuwenden.

Gibt es eine Möglichkeit zu erreichen, was ich versuche zu tun?

Answer 1

Wenn Sie sich bewerben class="li-no-hover" auf Ihre li Elemente Sie den Hover-Effekt nicht wollen, dann ist dies die CSS Sie wollen:

#result-side-menu li.li-no-hover:hover { 
    background-color: transparent; 
} 

Answer 2

Sie können dies versuchen:

#result-side-menu li.li-no-hover:hover { 
    opacity:1; 
}