Nano Hash - криптовалюты, майнинг, программирование

Как избавиться от синего прямоугольника фокуса в полях ввода в HTML/CSS?

Я использую Mac OS, поэтому я не могу точно сказать, представлен ли этот эффект на машинах с Windows или нет, поэтому я прошу прощения, если этот эффект не виден для вас.

Ввод и текстовые поля, кажется, имеют синий прямоугольник, когда они сфокусированы, по крайней мере, в Firefox и Chrome на Mac. У меня есть настраиваемый эффект фокуса на сайте, и мне интересно, могу ли я избежать отображения этого поведения выбора по умолчанию. Google избегает этого на своем сайте. Я дошел до того, что получил «действующий» стиль CSS для поля ввода Google, применил его к моему объекту css. Тем не менее, он по-прежнему показывает синий прямоугольник. Я не совсем уверен, что за вуду творит гугл, но мне кажется, что это не атрибуты HTML или CSS. Кто-нибудь знает, как избежать этого эффекта? Спасибо!

macos html css
07.09.2010

Ответы:


1

На самом деле это атрибут CSS. Это скроет эффект свечения:

input:focus, textarea:focus {
    outline: none;
}
07.09.2010
  • Я тоже использовал это раньше.. Дох. Большое спасибо .. (Работает блестяще) 07.09.2010
  • Имейте в виду, что это функция удобства использования браузера. Пользователям, особенно пользователям, ориентированным на клавиатуру, нравится знать, где находится фокус, прежде чем печатать. Если вы удалите это поведение, рассмотрите возможность предоставления других способов указать фокус для пользователя. 07.09.2010
  • Чтобы добавить к тому, что сказал Даг, это не просто функция удобства использования, это функция доступности. См. developer.chrome.com/extensions/a11y.html#keyboard. немного раздражает, что в OSX контур такой жирный. 17.09.2012
  • Для некоторых элементов, не являющихся формами, контур отображается, даже если он не нужен или не нужен для обеспечения доступности (блочные элементы, перетаскиваемые элементы и т. д.) — этот стиль отлично работает для предотвращения этого, и у него нет недостатков, когда он действительно не является элементом формы. 05.10.2012
  • @BoltClock, иногда у меня возникала эта проблема из-за box-shadow 03.07.2013
  • В каком браузере не работает? Будет полезно в решении вашего вопроса 03.12.2014
  • Это полезно для эмуляции собственного поведения ОС в сочетании с некоторыми JS для onClick. Например, помимо доступности, Mac OS X не выделяет всплывающие меню синим цветом всякий раз, когда вы нажимаете на них. И в зависимости от приложения, прямоугольники фокуса могут даже не использоваться с определенными текстовыми полями, что зависит от разработчика. Хотя я согласен, что его следует использовать с осторожностью, особенно со страницами, которыми пользуется множество разных людей. 03.04.2015
  • Что делать, если у меня есть tabindex, примененный к элементам, не имеющим фокуса, таким как span и div. Использование *:focus { outline: none; } работает, однако я не уверен, что это правильный путь. Пожалуйста подтвердите. 30.04.2015
    • Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..