在另一个div上悬停时更改颜色

Question

.menu:hover ~ .mts, .menu:hover ~ .mts2{

    background: #666666;

}

我有3个div，第一个是class = menu，这是主要的，另外两个在他里面。在悬停主要的那个我想改变这两个颜色...为什么这不起作用我看到答案这个答案但仍然没有用。

Answer 1

如果.menu是父级，则无需使用~空间即可。

.menu:hover .mts, .menu:hover .mts2{
    background: #666666;
}

  

~意味着下一个兄弟姐妹不是孩子的。

Answer 2

试试这个：

.menu:hover > .mts,  .menu:hover > .mts2 { background: #666666; }

如果它不起作用，背景属性可能会被其他地方的其他规则的某些内联css覆盖，在这种情况下，您可能会尝试应用！important作为最后的解决方案

Answer 3

看看这支笔： http://codepen.io/Debabrata89/pen/WwKKYQ

.menu:hover  .mts, .menu:hover .mts2{
     background: orange;
}