Html 单击按钮后如何保持正常样式

下面是我的html和css，效果非常好

当前行为是当按下按钮时，背景颜色按预期为绿色， 发布后，背景色为黄色。 但在这里，我希望背景颜色是蓝色（正常状态）

我无法删除：焦点，因为键盘选项卡应按预期工作

释放鼠标后，我还需要使用哪些选择器才能将按钮的背景色更改为蓝色

注意：-我不想要Jquery或javascript解决方案，我只需要css更改

按钮{背景色：蓝色}
按钮：焦点{背景色：黄色}
按钮：活动{背景色：绿色}

---

一个想法是考虑一个额外的包装，将得到点击，而不是按钮。诀窍是使用pseudo元素在上面创建一个透明层，您仍然可以使用键盘获得焦点

如果按钮上附加了任何单击处理程序，则需要将其移动到

span

按钮{背景色：蓝色}
按钮：焦点{背景色：黄色}
span:活动按钮{背景颜色：绿色；边框样式：插入；}
跨度{
显示：内联块；
位置：相对位置；
}
跨度：之前{
内容：“；
位置：绝对位置；
排名：0；
左：0；
右：0；
底部：0；
}

---

您好

只需删除焦点即可！！呃，然后将焦点设置为蓝色而不是黄色？我只是想了解一下，当通过tab键选择按钮时，是否要将其保持高亮状态，并在使用鼠标单击焦点后将其删除？如果是这样的话，Danield对这个问题给出了一个很好的答案。只要你不点击任何地方，按钮就会保持焦点。这是默认的浏览器行为，也是用户所期望的。你为什么要改变这一点？好的，你明白了：/但是

按钮能用吗？我认为您刚刚阻止了它，并且不会触发
onclick
事件：o@HaoWu这就是为什么我说：如果你有任何点击处理程序连接到按钮，你需要移动它的跨度而不是哦，刚刚注意到。。。sry。似乎没有简单的方法来解决这个问题，除非有某种选择器，比如
：tab focus
：/