[解決済み】クリック時にボタン周りのフォーカスを外す方法

質問

私のボタンはすべて、クリックした後にその周りにハイライトが表示されます。これはChromeの場合です。

<button class="btn btn-primary btn-block">
    <span class="icon-plus"></span> Add Page
</button>

Bootstrapをテーマで使っているのですが、それとは違うような気がします。以前、別のプロジェクトでこのことに気づきました。

を使用すると治ります。 <a> タグの代わりに <button> . なぜ？もし私が <button> を消すにはどうしたらいいのでしょうか？

解決方法は？

他のページでこのQ&Aを見つけ、ボタンのフォーカススタイルを上書きすることでうまくいきました。この問題は、MacOSでChromeを使う場合に特有のものかもしれません。

.btn:focus {
  outline: none;
  box-shadow: none;
}

ただし、これはアクセシビリティに関わることなので、ボタンや入力のフォーカスの状態をきちんと統一するまではお勧めできません。下のコメントにもあるように、マウスを使えないユーザーもいるのです。