CSS3有选择地禁用悬停效果

bdx*_*bdx 11 css css3

我有一个包含多个项目的未编号列表 - 有些项目是'标题',大多数项目是链接.

目前,我的列表中有以下CSS:

#result-side-menu li:hover {
  background-color: rgba(0,0,0,0.15);
}
Run Code Online (Sandbox Code Playgroud)

我希望能够仅在标题列表项上禁用悬停,同时将其保留在所有其他项上.到目前为止,我最好(但仍然不成功)的尝试是这样做:

#result-side-menu.li-no-hover li:hover {
  background-color: none;
}
Run Code Online (Sandbox Code Playgroud)

然后将其应用于class="li-no-hover"标题列表项.

有没有办法实现我想要做的事情?

3dg*_*goo 22

如果你申请class="li-no-hover"你的li元素你不想要悬停效果,那么这就是你想要的CSS:

#result-side-menu li.li-no-hover:hover {
    background-color: transparent;
}
Run Code Online (Sandbox Code Playgroud)