Отключить компонент автозаполнения тени в поле фокуса
Я использую ввод автозаполнения primeng
Я бы хотел, чтобы, когда я сосредотачивался на вводе, эффект синего свечения отключался.
Вот мой html-компонент
<p-autoComplete [(ngModel)] = "text" [suggestions] = "results" (completeMethod) = "search($event)"
emptyMessage = {{noBorrowerResult}}
[minLength] = "3"
[size] = "40"
field = "name"
>
<ng-template let-elm pTemplate = "item">
<div class = "suggestion-item">{{elm.name}} ( ID: {{elm.code}} )</div>
</ng-template>
</p-autoComplete>
Я пытался изменить css в соответствии с документация
::ng-deep .ui-autocomplete {
box-shadow: 0 !important;
}
но это не работает.
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
1
0
1 744
4
Ответы 4
.ui-autocomplete:focus {
outline-color: transparent;
outline-style: none;
}
Предотвратит этот эффект в Chrome и Safari
это будет работать в Chrome, Safari и Firefox
.ui-autocomplete:focus, .ui-autocomplete::-moz-focus-inner {
outline: 0;
border: 0;
}
и добавьте этот тег meta, чтобы удалить его из IE9
<meta http-equiv = "X-UA-Compatible" content = "IE=9" />
подробнее: https://css-tricks.com/removing-the-dotted-outline/
Пока это работает для меня
::ng-deep.ui-inputtext:enabled:focus:not(.ui-state-error) {
outline: 0 none !important;
outline-offset: 0 !important;
box-shadow: 0 0 0 0 !important; /*I remove the border shadow*/
border-color: black !important; /*Can change to any color*/
}
Напишите приведенный ниже код в файле CSS, но он будет применяться ко всем вводимым на этой странице.
:host >>> .p-inputtext:enabled:focus {
border-color:#ced4da !important; //to avoid border color change
box-shadow:none !important;
}
Другие вопросы по теме
Изменение цвета управления каруселью Bootstrap 4
Дивы накладываются друг на друга, а не накладываются сверху
Почему цвет фона заполняет весь экран?
Chrome, похоже, не переходит по ссылке на таблицу CSS. IE и Edge ОК
Чтобы сделать весь div интерактивным?
Как переопределить `outline: 0` и вернуться к стилям фокуса таблицы стилей пользовательского агента?
Как сделать так, чтобы изображения были отзывчивыми и одинаковой высоты?
Почему в поле неизвестны поля / отступы?
Создайте сквозной стиль с помощью flexbox и псевдоэлементов
Как удалить пространство с правой стороны в мобильной версии в Bootstrap 4?
Похожие вопросы
Изменение цвета управления каруселью Bootstrap 4
Почему цвет фона заполняет весь экран?
Чтобы сделать весь div интерактивным?
Передайте значение в модальное окно, а затем в функцию контроллера
Библиография глав Gitbook не в алфавитном порядке
Как сделать так, чтобы изображения были отзывчивыми и одинаковой высоты?
Автоматическая радиокнопка PHP, которая щелкала до очистки после нажатия предыдущей
Проблема с автовоспроизведением HTML-видео для всех браузеров
Что означают "двойные кавычки" в Chrome? (Это странно)
Содержание iframe превышает 100%
что не отключает синий эффект