JavaScriptを使用してブラウザのフォーカス境界を削除または無効にします

Question

（ほとんどのブラウザーで）dom要素にtabindex順序にフォーカスがある場合、dom要素の破線の境界線を無効化または操作する方法を知っていますか？

フォーカスされた要素に対して独自のスタイルを構築したいのですが、既存の機能を使用することは素晴らしいことです。tabindexを使用すると、keydownイベントをdom要素にバインドできるからです。

Answer 1

outline:none;を持つ必要な要素のCSSルールを作成するだけです

Answer 2

CSSトリック：

:focus { outline: none; }

Answer 3

Firefox 53.0では、提案されたソリューションのいずれかでアウトラインを無効にすると、Firefoxはデフォルトのソリューションを表示します。

ただし、空白の色を使用すると、アウトラインが非表示になっていることは検出されません。

input:focus{
   outline: 1px solid rgba(255,255,255,1);
}

Answer 4

a {
outline: 0;
}

a: hover,
a: active,
a: focus {
     outline: none;
}

input::-moz-focus-inner {
border: 0;
}

Answer 5

input::-moz-focus-inner { border: 0; }

Answer 6

:focus state- outline property を0pxの透明なソリッドに設定します。