Как изменить Safari автозаполнение желтый цвет фона

Question

Это изображение, что я получаю от сафари:

Хотя это мой код:

Источники:

How to Remove WebKit's Banana-Yellow Autofill Background

Remove forced yellow input background in Chrome - даже он говорит хром, но все еще указывает на webkit-autofill

Я попытался использовать background-color:white !important;, чтобы переопределить заблокированный css. Инструмент «Отладка» показал, что фоновый цвет пользовательского стили пользователя был вычеркнут, но цвет еще не изменился и пользовательский интерфейс был использован.

Это то, что меня действительно смутило, я понятия не имею, почему не разрешено изменять Таблицу User Agent.

Answer 1

Читал, что большинство браузеров хотят указать автозаполнение (при этом Safari является немного более непреклонным с этим указанием).

Я нашел альтернативу hack, где вы используете -webkit-box-shadow для покрытия цвета фона. При проверке попытка настроить целевой ввод с классом не работает (т. Е. Специфичность).

В Safari, (10.0.2) браузер добавляет shadow content в качестве пользовательского агента, который включает в себя фоновый цвет и значение автозаполнения. Проблема здесь в том, что браузер запрещает редактирование этих конкретных стилей (например, background-color), поэтому причина ответа ниже.

input:-webkit-autofill, input:-webkit-autofill:focus { 
    -webkit-box-shadow: 0 0 0 1000px white inset; 
    -webkit-text-fill-color: #333; 
} 

, если у вас также есть границы дна во входном

input:-webkit-autofill, input:-webkit-autofill:focus { 
    border-bottom: 1px solid #333; 
} 

Источник:
- medium-post
- stackoverflow discussion
- why-browsers ignore autocomplete="off"