使用选项卡按钮时更改突出显示的按钮颜色答案

【问题标题】：Change colour of button highlighted when using tab button使用选项卡按钮时更改突出显示的按钮颜色
【发布时间】：2020-06-03 00:00:01
【问题描述】：

我目前正在尝试使我的应用程序对用户更加键盘/视觉友好。我添加了一些功能，可为用户提供更好的视觉指示，但我注意到在使用按钮时，当按下应用程序时，很难看到按钮当前何时突出显示。

如示例所示，我们可以看到左侧的按钮被突出显示。但是我希望它是突出显示功能是不同的封面或更大，以便用户可以看到就是这种情况。

 <button class="btn btn-blue" ng-click="handleCreate()" ng-show="isNew" ng-disabled="detailsForm.$invalid">
        Create
 </button>

我会假设我需要修改 css，但我不太确定如何实现这一点或我需要什么标签。有什么建议吗？

【问题讨论】：

【解决方案1】：

为此，有:focus 选择器。 (Read more)

button:focus {
  background: #ff0000;
}

<button>TEST1</button>
<button>TEST2</button>
<button>TEST3</button>

【讨论】：

【解决方案2】：

使用:focus 规则。

例如：

.button:focus {
    border: 1px solid red;
}

【讨论】：