html中点击按钮闪现,[CSS] hover 死循环，不断闪现。

.content{

width: 300px;

height: 300px;

}

.test{

width: 200px;

height: 200px;

background-color: red;

}

.test1:hover{

display: none;

}

.test2:hover > .item{

display: none;

}

如上面的 代码：

造成闪现的原因：

当上面代码中 class="test1" 被 hover 后就隐藏，但是隐藏后该元素就没有被hover住了又会显示出来。显示出来后又被hover 又被隐藏。这样不断重复就成了上面的不断闪的效果。

我的解决方法：

我在test1 div 的代码基础上增加了一个子元素。形成了test2 div的代码。 把内容写在子元素里面。当我想要hover隐藏内容时就隐藏被hover对象的子元素。那样hover的作用也会一直生效。

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------

你还有其他的解决方法吗？欢迎分享相应的解决方法。