Htmlとcssのみを使用して、アクティブな入力フィールドの周囲の青色(Firefox)のハイライト色を無効にするにはどうすればよいですか。 input {outline:none;}
を使用してみましたが、成功しませんでした。助けてくれてありがとう! =)
oK、アウトラインに関する以前のコードを無視して、間違ったプロパティを選択して変更しました。私が取得しようとしているのは、スタイルを変更したり無効にしたりせずに、アクティブなフォーム入力フィールドの周囲の強調表示(ブラウザ、表示される太字と色付きの境界線)を単に削除することです。ありがとう=)
:focus宣言を使用する必要があります。この場合:
input:focus {outline:none;}
プロジェクト内のすべての入力には青い境界線がありません。
特定の属性が必要な場合は、これを使用します。
input[type=text]:focus {outline:none;}
それが役に立てば幸い。 =)
これを参照してください fiddle 。
outline: none
を機能させるには、ボーダープロパティを設定する必要があるようです。 borderディレクティブでコメントすると、アウトラインが消えます。
input {border:0; outline:none;}
すべての境界線/アウトラインを削除する必要があります。
答えは私が信頼したよりも簡単です:
box-shadow:none;
編集:私の解決策は複雑にする方法でした。それは簡単です:
input:focus {
outline: none;
}
:focus状態をターゲットにする必要があります。
ハイライトを削除するには、このルールを入力フィールドに追加してみてください。
-moz-appearance:none;
これは、それぞれのプレフィックスを使用して、WebKitベースのブラウザーでも実行できます。
-webkit-appearance:none;
これは、CSSプロパティを1つだけ使用して、境界線、アウトラインなどを処理します。 WebKitペアおよびFirefox以外のブラウザの場合-Opera and IE-border
およびoutline
プロパティを含めることをお勧めしますまた、ブラウザの相互互換性を確保します。
button {
-webkit-tap-highlight-color:transparent;
-moz-tap-highlight-color:transparent;
-o-tap-highlight-color:transparent;
tap-highlight-color:transparent;
}