javascript - 在悬停时为列表中的 sibiling li 元素设置样式

标签 javascript html css

<分区>

基本上我有一个元素列表,当我将鼠标悬停在最后一个元素上时,我希望所有其他元素也更改它们的背景颜色。到目前为止,我尝试了一些解决方法但没有成功。

<ul class ='profile'>
<li> item 1 </li>
<li> item 2 </li>
<li> item 3 </li>
</ul>
ul.profile > li:nth-child(3):hover {
  background-color: red;
}

最佳答案

试试这个:

ul.profile:hover > li:not(:hover) {
  background-color: yellow;
}
ul.profile > li:nth-child(3):hover {
  background-color: red;
}

关于javascript - 在悬停时为列表中的 sibiling li 元素设置样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55721666/

上一篇:html - 点没有出现

下一篇:javascript - 是否可以计算 html 页面的空白区域?

相关文章:

javascript - 使用 Javascript 访问 MS CRM 4.0 中 IFrame 中加载的页面上的控件

html - 将一个 div 减半并达到 100% 高

javascript - 将递增运算符更改为递减运算符后窗口不会关闭

html - 如何将此文本移动到另一行

jquery - 根据单元格内的值设置单元格的背景颜色

javascript - Meteor 账户路由

javascript - 使用键盘滚动无序列表

javascript - AJAX/Javascript 在 PHP 中页面加载时选择元素更改

jquery - 更改文本字段 css 中的光标焦点位置

css - 如何为页眉和页脚添加边距? [包括截图]