当焦点是另一个元素时，更改元素的样式

Question

当焦点在另一个div上时我需要更改div的样式。我尝试了以下代码但是没有工作

<div id="one">
<div id="two">

我的css文件看起来像这样

#one {
    background-color:red;
}
#two:focus #one {
    background-color:green;
}

非常感谢任何帮助！

Answer 1

如果您的意思是:hover而不是:focus，请使用+使用相邻选择器，这将选择#two :hover #one #one:hover + #two { color: red; } }

if

Demo

  

注意：您输入错误信息，例如id而不是div，也请关闭div   元件。

---

当您评论要使用焦点:hover时，请将:focus替换为<div id="one" tabindex="1">One, Hover Me</div> <div id="two">Two</div> #one:focus + #two { color: red; } ，但相邻的选择器逻辑保持不变...

{{1}}

Demo （按第一行查看效果）或（点击jsfiddle中的结果窗口，然后按一下标签按钮）

Answer 2

使用jquery解决问题或在css中使用悬停属性