hover某个元素，使另一个元素发生变化,hover 失效

发布于
2016-10-12

/*.container:hover ul.ul li:nth-child(2){
            background: #000;
        }*/
        .wrap{
            width: 100px;
            height: 100px;
            background: #6c0;
        }
        /*hover失效*/
        .container:hover div.wrap{
            background: red;
        }
    </style>
</head>

<body>
    <div class="container"> 
        <ul class="ul">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>
    <div class="wrap"></div>
</body>

html css

阅读 29.3k

4 个回答

✓ 已被采纳

默认情况下如果你想hover到一个元素上改变另外一个元素的CSS样式，被改变的元素必须是被hover元素的子元素，但你现在container和wrap不是父子关系，而是兄弟关系，那么你必须要这样设置了。

.container:hover +.wrap{
    background: red;
}

348290688

92514

发布于
2016-10-12

建议不要单纯使用，因为hover很难实现而且必须有关联才能使用伪类选择器

xiatianlong

2.2k42954

发布于
2016-10-12

更新于
2016-10-12

hover应该只能对当前标签触发效果吧。。要么就用js的mouseover事件了。

undefind_5

1.5k1297133

发布于
2016-10-12

更新于
2016-10-12

你对css要求过分了，当然，如果你非要用css实现，也可以，在你要hover的元素下包含要改变背景的元素，然后再把该元素定位出来，加上hover样式，应该可以实现，不过这样子很危险，可能会出现闪烁的效果，建议还是有js+css实现最保险，也是最常用的方式

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题

hover某个元素，使另一个元素发生变化,hover 失效

你尚未登录，登录后可以

纯css如何绘制一个无背景色有边框色，带有文字的倒等腰梯形？

css布局怎么保证右边一直在可视范围内？

图片沿着圆环的转动有什么方法吗？

flex相关 flex: 1的子元素如何宽度能100%且不溢出？

CSS如何巧妙实现标题居中、关闭按钮居右效果？

js阻止冒泡问题？

Scss的rgba()方法无法对变量进行二次编译？