Firefox のボタンから点線のフォーカス アウトラインを削除する方法

Firefox でリンクを超えた要素の点線のフォーカス アウトラインを削除する

Firefox のリンクから見苦しい点線のフォーカス アウトラインを削除するのは、CSS を使用するのが簡単です。プロパティ a:focus { アウトライン: なし; }、同じテクニックを <button> に適用します。

解決策: Mozilla 固有の疑似要素を利用する

Firefox のボタンの点線の輪郭を消すには、ブラウザを使用する必要があります。 - 固有の疑似要素 ::-moz-focus-inner。この要素により、ボタンの境界内に表示されるフォーカス リングを正確にターゲットにすることができます。 border プロパティを 0 に設定すると、アウトラインを効果的に非表示にできます。

これを実現する CSS コードは次のとおりです。

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

このコードを配置して、ボタンをクリックすると、 Firefox では、点線のアウトラインが表示されなくなり、より美しく一貫したユーザー エクスペリエンスが提供されます。

以上がFirefox のボタンから点線のフォーカス アウトラインを削除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。