单击仅使用css更改div背景颜色

Question

所以我有一个div我想改变点击时的颜色.我有三个div,我想在点击它时表示哪一个是活动div

基本上我想使用CSS活动属性,但是当鼠标向上发生时没有特定的div更改.有点像焦点.如果有帮助,我也在使用bootstrap

这是html的一个例子

<div>
    Section 1
</div>
<div>
    Section 2
</div>
<div>
    Section 3
</div>

谁能告诉我如何在不使用javascript的情况下实现这一目标？

Answer 1

通过添加tabIndex使您的DIV可聚焦:

<div tabindex="1">
Section 1
</div>

<div tabindex="2">
Section 2
</div>

<div tabindex="3">
Section 3
</div>

然后你可以简单地使用:focus伪类

div:focus {
    background-color:red;
}

Answer 2

试试这个，它对我有用：

div:active{  

    background-color:white;

}