Как убрать фиолетовый цвет ссылок в css
Цвет ссылок, по умолчанию, меняется в одном из трёх случаев:
- Ссылка, по которой пользователь уже перешёл. За это состояние отвечает псевдокласс :visited
- Ссылка при наведении курсора мыши. Изменить стили можно с помощью псевдокласса :hover
- Ссылка при клике, но до момента, как произошёл переход. Определить стили у такой ссылки можно у псевдоэлемента :active
href="https://ru.hexlet.io">На сайт Хекслета a:hover /* Цвет при наведении */ color: red; > a:visited /* Цвет посещённой ссылки */ color: green; > a:active /* Цвет ссылки при клике */ color: blue; > Убрать выделение кнопки при нажатии
Как убрать синий border у кнопки при нажатии
Здравствуйте! Сайт сделан на бутстрапе, при клике по кнопке отображается синяя рамка, как ее можно.
При нажатии на кнопку,другие кнопки приближаются к данной кнопки
Привет всем!При нажатии на кнопку,другие кнопки приближаются к кнопке на которую я нажимаю.Так как.
Выделение при нажатии на картинку
<a href=#><img src=1.jpg></a> либо <div onclick=func()>нажми на меня</div> при нажатии на.
Выделение area при нажатии
Доброго времени суток, у меня возникла проблема с тегом area , мне не обходимо , чтобы при нажатие.
В css файле добавить к селектору свойство outline со значением none
outline: none
Я обычно применяю данное правило к тэгу button.
.buttonX { border: 1px solid #000066; margin: 0px; padding: 10px; outline: none; background-image: url('../X.png'); width:26px; }
1 Если применить стиль с рисунком то кнопочная сущность тут же проявляется и она начинает прыгать при нажатии. Есть стиль который за это отвечает?
2 может проще было вписать прозрачную кнопку в ячейку таблицы, только у меня не получилось кнопку чётко вписать в table, это реально подогнать под размер?
Убрать выделение ИНПУТа при выборе из списка
Стандартные механизмы браузеров при выборе в Input значения из списка вводимых ранее подсвечивают.
Действия при нажатии кнопки
Привет. Подскажите пожалуйста, как при нажатии кнопки отправлять сообщение почтовой программой по.
Выделение картинок синим цветом при частом клике по ним, как убрать?
Выделение картинок синим цветом на html-странице при частом клике по ним, как убрать? Пример на.
Изменение цвета кнопки при нажатии
Подскажите, пожалуйста, как сделать так, что бы цвет кнопки при наведении был одним, а при нажатии.
Как убрать фокус с кнопок при нажатии
У моих кнопок есть подсветка вокруг них после нажатия на них. Это находится в Chrome. 
Я использую Bootstrap с темой, но я уверен, что не это: я замечал это раньше в другом проекте. Это исчезает, если я использую тег вместо . Зачем? Если бы я хотел использовать , как бы я его убрал?
Можете ли вы изменить название вопроса на «Как убрать стили фокуса вокруг кнопок при нажатии». Без стиля это неоднозначно. Я наткнулся на это, пытаясь найти способ убрать фокус на кнопке после щелчка (сфокусироваться на чем-то другом). Благодарю.
Могу ли я предложить сделать правильный ответ Pjs, потому что он поддерживает тех пользователей, которые не могут щелкать мышью и имеют клавиатуру, в то же время удаляя схему при щелчке: stackoverflow.com/a/37580028/4709300
28 ответов, предлагающих различные методы решения этой проблемы, являются свидетельством плачевного состояния веб-разработки на переднем крае сегодня.
20 ответов
Я нашел эти Q и A на другой странице, и переопределение стиля фокуса кнопки сработало для меня. Эта проблема может быть специфичной для MacOS с Chrome.
Обратите внимание, что это имеет значение для доступности и не рекомендуется, пока у вас не будет хорошего согласованного состояния фокусировки для ваших кнопок и входов. В соответствии с комментариями ниже, есть пользователи, которые не могут использовать мышей.
Я думаю, у нас нет другого выбора. Вы также можете добавить .btn:active:focus , чтобы удалить его из активного состояния.
Удаление контура с кнопки определенно вредно для доступности. Есть пользователи, которые не могут управлять мышью и должны иметь возможность перемещаться по странице с помощью клавиатуры. Удаление контура делает это очень трудным. Вероятно, лучше не давать кнопке получать фокус при нажатии.
Для будущих путешественников этот код полностью заменяет все стили во всех состояниях кнопок для кнопки по умолчанию (не для всех кнопок): .btn-default, .btn-default:hover, .btn-default:active, .btn-default:active:focus, .btn-default:visited, .btn-default:focus < color: #dcdcdc; background-color: #232323; outline: none; >
Метод .blur() корректно удаляет выделение фокуса и не путает стили Bootstraps.
Это сработало отлично! Будут ли потенциальные проблемы, если я попытаюсь присоединить другой обработчик события click () (т. Е. Код, который выполняется при нажатии указанной кнопки) к той же кнопке?
Это сработало для меня, когда мне нужно было скрыть класс фокуса только на определенной части моего сайта, и я не хотел переопределять класс фокуса для кнопок ВСЕ.
Если кто-то здесь задается вопросом, работает ли это в bootstrap v4, это так. Ответ действителен в 2018 году, ура!
Не могу поверить, что никто еще не опубликовал это.
Используйте ярлык вместо кнопки.
Это прекрасно работает для большинства пользователей, но этот метод не подходит для программ чтения с экрана или клавиатур и оставит незрячих пользователей и пользователей с ослабленной моторикой неспособными взаимодействовать с кнопкой.
Хорошее решение, помогло мне, но почему-то не работает для угловой директивы, даже с оберткой, например
При использовании вкладок ярлыки полностью пропускаются для пользователей, не являющихся мышами, что плохо для доступности
Хотя легко просто удалить схему для всех сфокусированных кнопок (как в user1933897 answer), но это решение плохо с точки зрения доступности (например, см. Остановить передачу сообщений с помощью фонового фокуса браузера по умолчанию)
С другой стороны, вероятно, невозможно убедить ваш браузер прекратить стилизацию нажатой кнопки, если она сфокусирована, если она думает, что она сфокусировалась после нажатия на нее (я смотрю на вас, Chrome на OS X).
Итак, что мы можем сделать? Мне приходят в голову пара вариантов.
1) Javascript (jQuery): $(‘.btn’).mouseup(function() < this.blur() >)
Вы поручаете вашему браузеру удалить фокус вокруг любой кнопки сразу после, нажатие кнопки. Используя mouseup вместо click , мы сохраняем поведение по умолчанию для взаимодействий на основе клавиатуры ( mouseup не запускается клавиатурой).
Здесь вы отключите контуры для кнопок зависания. Очевидно, что это не идеально, но может быть достаточно в некоторых ситуациях.
Число 1 — полезный совет. Он отключит фокусировку, когда кнопка не нажата, однако он будет отображаться, пока она нажата. Я отключил фокус на выбранном активном элементе с помощью :active:focus
Сокращенные функции, которые связывают прослушиватели событий, в jQuery устарели, поэтому лучше использовать .on(‘mouseup’, function() < . >) вместо .mouseup()
Я понимаю, что фокус сначала применяется после события onMouseDown , поэтому вызов e.preventDefault() в onMouseDown может быть чистым решением в зависимости от ваших потребностей. Это, безусловно, удобное для доступа решение, но, очевидно, оно регулирует поведение щелчков мыши, которые могут быть несовместимы с вашим веб-проектом.
В настоящее время я использую это решение (в рамках проекта react-bootstrap ), и я не получаю фокус мерцания или удерживания фокуса кнопок после щелчка, но я все еще могу включить мой фокус и визуально визуализировать фокус те же кнопки.
Да. Ваше решение работает. Спасибо за чаевые. Вот скрипка для решения. Но это требует, чтобы обработчик JavaScript был присоединен к каждой кнопке. Было бы здорово, если бы мы могли достичь этого только с помощью CSS-решения.
Я думаю, что люди ожидают, что внимание будет сосредоточено на элементе, когда вы нажмете на него, и это решение предотвращает это. Я часто нажимаю на элемент и затем удаляюсь перед тем, как отпустить мышь, чтобы сфокусировать его, чтобы потом можно было вкладывать.
Для любого, кто просматривает фрагмент, это должно работать и сохранять onClick: onMouseDown=
Это предотвращает «нажатие» кнопки пробелом и клавишей возврата. Возможно, более полным решением будет добавить это обратно с помощью: onKeyUp= .
Не следует вызывать e.preventDefault () внутри события onKeyUp . Оказывается, если вы это сделаете, то кнопка остается сфокусированной после нажатия клавиши пробела или клавиши возврата и вкладки или щелчка в любом месте.
Если вы используете правило :focus < outline: none; >для удаления контуров, ссылка или управление будут фокусируемыми, но без указания фокуса для пользователей клавиатуры. Способы его удаления с помощью JS, например, onfocus=»blur()» , еще хуже, и пользователь клавиатуры не сможет взаимодействовать с элементом управления.
Используемые хаки, которые вид OK, включают добавление правил :focus < outline: none; >, когда пользователи взаимодействуют с мышью и удаляют их снова, если обнаружено взаимодействие с клавиатурой. Линдсей Эванс сделал для этого lib: https://github.com/lindsayevans/outline.js
Но я бы предпочел установить класс в теге html или body. И иметь контроль в файле CSS, когда использовать это.
Например (встроенные обработчики событий предназначены только для демонстрации):
a:focus, button:focus < outline: 3px solid #000; >.no-focus a, .no-focus button This her is a link