ホームページ >ウェブフロントエンド >CSSチュートリアル >Google Chromeのフォーム自動入力の黄色の背景を修正するにはどうすればよいですか?

Google Chromeのフォーム自動入力の黄色の背景を修正するにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-12-22 07:59:13964ブラウズ

How Do I Fix the Yellow Background in Google Chrome's Form Autofill?

Google Chrome フォームの自動入力: 背景が黄色になる問題に対処する

Google Chrome のフォーム自動入力機能はログイン フィールドとパスワード フィールドに便利に入力しますが、背景が黄色です背景が見た目に不快なものになる場合があります。この問題は、Chrome が記憶された認証情報を保存するときに発生する可能性があります。

解決策: 黄色の背景を削除する

黄色の背景を削除して自動入力機能を無効にするには、次の手順に従います。

  1. Ctrl Shift I (Windows) または Cmd を押して、Chrome デベロッパー ツール パネルを開きます。 Shift I (macOS)。
  2. 「要素」タブを選択します。
  3. 背景が黄色の入力フィールドに対応する HTML 要素を見つけます。
  4. スタイル ペインで、 「box-shadow」プロパティを見つけます。
  5. box-shadow プロパティ内の「white」値を次のように置き換えます。 "transparent."

以下の更新されたコード スニペット:

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
}

この変更により、黄色の背景が透明な背景に置き換えられ、効果的に削除されます。さらに、自動入力機能を無効にすると、Chrome は記憶された認証情報を保存しなくなります。

自動入力色のカスタマイズ

別の背景色を使用したい場合は、自動入力フィールドでは、「透明」を希望の色の値に置き換えるだけです。たとえば、水色を使用するには、次のようにコードを更新します。

input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #edf2f7 inset !important;
}

CSS をカスタマイズすると、特定のデザイン要件を満たすようにフォームの自動入力機能の外観と機能を変更できます。

以上がGoogle Chromeのフォーム自動入力の黄色の背景を修正するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。