html点击出现另一个div,css当点击一个div元素时，另外一个div元素也改变样式

css当点击一个div元素时，另外一个div元素也改变样式

我们通常会遇到这样的情况，当鼠标在a元素时b元素的样式也改变。当然用JS实现很简单，那么纯CSS实现呢？其实也是相当简单，代码如下。

一，影响其他元素

.a{

width:100px;

height:100px;

background:#ccc;

}

.b{

width:100px;

height:100px;

background:#fff;

}

.a:hover .b{ background:red;}

1

2

二，影响相邻元素

.a{

width:100px;

height:100px;

background:#ccc;

}

.b{

width:100px;

height:100px;

background:#fff;

}

.a:hover +.b{ background:red;}

1

2

同理如果要影响其他元素，可以查看一下CSS元素选择器。

网址:http://www.itxst.com/detail/m6fjbyuv.html