Появляется, когда выпадающее меню с suggestion texts открывает вход.
Настройка фокуса, активных, стилей наведения не помогает. Это похоже на DOM.
Как удалить границу и фон входного текста в Edge?
ОБНОВЛЕНИЕ
Если нет css-решения, может ли кто-нибудь ответить мне ссылкой на статью о том, как она работает, и/или предоставить мне обходное решение javascript (я хочу, чтобы это было похоже на вход в google.com).
Из ответов, приведенных в этот похожий вопрос на SO, и, как вы подозревали, список автозаполнения, который появляется под текстовым полем, выходит из DOM и поэтому не может ориентироваться на CSS.
Из моих экспериментов по codepen кажется, что Edge накладывает полупрозрачный элемент поверх текстового поля (согласованный как по высоте, так и по ширине), а не по стилю, который применяется к самому текстовому поле.
Моя первая демо-версия кодефа показывает, что происходит с стилем при выключении автозаполнения. Вы увидите, что, цепляя псевдоклассы :hover и :focus, я могу создать другой стиль при наведении курсора на текстовое поле, которое уже находится в фокусе (синий, когда он находится в фокусе, красный при падении над тем же текстовым полем, когда он находится в фокус).
Это стоит отметить при просмотре моей второй демо на codepen (в Edge, очевидно), которая включена автозаполнением. Когда вы нажимаете на текстовое поле, цвет фона красный (как и ожидалось - я наводил курсор на текстовое поле, которое находится в фокусе). Однако слегка двигайте мышью, и фон меняется на синий, указывая на то, что текстовое поле активно, но больше не зависнет. Это неверно - мы все еще нависаем над ним.
Это может быть причуда с Edge или ошибка, связанная с тем, как браузер обрабатывает автозаполнение. Это может стоить подняться с Microsoft - похоже, ничего не говорится об этом в трекер ошибок.
Один из ответов, приведенных в первой ссылке I, предлагает использовать jQueryUI реализацию автозаполнения. Это немного странно, когда браузер должен делать это по умолчанию, но вы сможете настроить талисман списка автозаполнения и, теоретически, избегать проблем, которые у вас есть.
Вы должны добавить autocomplete="off" в поле input
<input type="text" placeholder="Type here" autocomplete="off">
И
Если это динамический элемент или вы не можете добавить его в свой input, тогда вы можете сделать это с помощью простого script
$('input').attr('autocomplete','off');
Лучше отключить autocomplete
<input type="text" placeholder="Type here" autocomplete="off">Я не тестировал его, у меня нет доступа к IE прямо сейчас, но в других браузерах некоторые поведения по умолчанию могут быть обновлены с использованием некоторого CSS. Надеюсь, это поможет вам:
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;