убрать подсвечивание ссылки после активации
например, такие кнопки. как сделать так, чтобы после активации ссылки, при отводе от неё курсора она не подсвечивалась точечным пунктиром(см.картинку)
Отслеживать
4,561 12 12 серебряных знаков 30 30 бронзовых знаков
задан 25 авг 2016 в 18:21
289 1 1 золотой знак 5 5 серебряных знаков 19 19 бронзовых знаков
это выделен текущий объект, а если попробовать Яваскриптом или Jquery выделить какой то другой объект?
25 авг 2016 в 18:28
1 ответ 1
Сортировка: Сброс на вариант по умолчанию
Это свойство активных элементов называется outline . По-умолчанию браузеры таким образом выделяют элемент, с которым взаимодействует пользователь. Причем, это не только ссылки, но и кнопки, поля ввода и т.д.
Убрать легко. Добавьте в CSS ссылке (или даже всем a ) свойство
outline: none !important; Отслеживать
ответ дан 25 авг 2016 в 19:16
Иван Пшеницын Иван Пшеницын
4,561 12 12 серебряных знаков 30 30 бронзовых знаков
- html
- css
-
Важное на Мете
Похожие
Подписаться на ленту
Лента вопроса
Для подписки на ленту скопируйте и вставьте эту ссылку в вашу программу для чтения RSS.
Дизайн сайта / логотип © 2023 Stack Exchange Inc; пользовательские материалы лицензированы в соответствии с CC BY-SA . rev 2023.11.15.1019
Нажимая «Принять все файлы cookie» вы соглашаетесь, что Stack Exchange может хранить файлы cookie на вашем устройстве и раскрывать информацию в соответствии с нашей Политикой в отношении файлов cookie.
Как убрать подчеркивание у ссылок?
Используйте свойство text-decoration со значением none для селектора A .
Описание
По умолчанию ссылки всегда подчёркиваются, чтобы легко можно было отличить ссылку от рядового текста. Но в некоторых случаях подчеркивание допустимо убрать, когда очевидна разница между ссылкой и текстом.
Чтобы ссылки не подчер кивались, для селектора A следует добавить свойство text-decoration со значением none , как показано в примере 1.
Пример 1. Ссылка без подчеркивания
HTML5 CSS 2.1 IE Cr Op Sa Fx
Ссылки без подчеркивания Ссылка без подчеркивания
Результат данного примера показан ни рис. 1.
Рис. 1. Ссылка, у которой отсутствует подчёркивание
HTML по теме
CSS по теме
Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.
Популярные рецепты
Как добавить картинку на веб-страницу?
Как добавить иконку сайта в адресную строку браузера?
Как добавить фоновый рисунок на веб-страницу?
Как сделать обтекание картинки текстом?- Как растянуть фон на всю ширину окна?
- Как выровнять фотографию по центру веб-страницы?
Как разместить элементы списка горизонтально?
Как убрать подчеркивание у ссылок?
Как убрать маркеры в маркированном списке?
Как изменить расстояние между строками текста?
Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?- Как открыть ссылку в новом окне?
Как убрать подчеркивание ссылки CSS
По умолчанию, браузеры применяют определенные наборы стилей CSS к конкретным HTML-элементам . Для гиперссылок эти стили по умолчанию определяют, что любой текст ссылки отображается синим цветом с CSS underline . Это делается для того, чтобы посетители сайта могли легко определить, что данный текст представляет собой ссылку. Многие веб-дизайнеры не уделяют внимания этим стилям по умолчанию, особенно это касается подчеркивания. К счастью, CSS позволяет легко изменить внешний вид гиперссылок.
Как убрать подчеркивание ссылки CSS
Подчеркнутый текст может сложнее читаться, чем обычный. Многие дизайнеры просто не уделяют этому должного внимания. Но можно полностью удалить подчеркивание. Для этого мы будем использовать свойство CSS text-decoration . Вот CSS-код , с помощью которого это можно сделать:
С помощью этой строки кода можно удалить CSS underline style всех ссылок.
Предостережение относительно удаления подчеркивания
Нравится вам подчеркивание или нет, нельзя отрицать того, что оно позволяет указать на связь текста со ссылкой. Если убрать подчеркивание или изменить синий цвет ссылок, то нужно предоставить взамен стили, которые позволяют выделить текст ссылок. Это сделает взаимодействие посетителей с сайтом интуитивным.
Не подчеркивайте текст, не связанный со ссылкой
Не подчеркивайте текст, который не является ссылкой. Люди привыкли к тому, что подчеркнутый текст ( с помощью CSS underline color ) является ссылкой. Если вы подчеркиваете контент, чтобы акцентировать на нем внимание ( вместо того, чтобы вывести его полужирным шрифтом или курсивом ), вы вводите пользователей сайта в заблуждение.
Измените сплошное подчеркивание точками или пунктиром
Если хотите сохранить подчёркивание ссылок, но при этом изменить стиль по умолчанию ( линия » solid » ), это можно сделать следующим образом. Вместо сплошной линии используйте точки. Для этого нужно удалить подчеркивание и заменить его свойством border-bottom :
Так как стандартное CSS text decoration underline мы удалили, будет отображаться только линия из точек:
То же самое можно сделать, чтобы получить пунктирное подчеркивание. Просто измените значение border-bottom на dashed :
Изменение цвета подчеркивания
Еще один способ обратить внимание пользователей на ссылки — изменить цвет подчеркивания. Н забудьте, что цвет text underline CSS должен соответствовать используемой цветовой схеме:
Как сделать двойное подчеркивание
Хитрость в создании двойного подчеркивания заключается в изменении ширины рамки. Если создать рамку шириной в 1 пиксель, в результате получится два подчеркивания, которые выглядят как одно:
Также можно использовать подчеркивание по умолчанию, чтобы создать альтернативное двойное подчеркивание. Например, чтобы одна из линий была двойной:
Не забывайте о различных состояниях ссылок
Также можно использовать border-bottom для различных состояний ссылок. Использование псевдокласса :hover поможет улучшить опыт взаимодействия пользователей. Чтобы создать второе точечное подчеркивание, выводимое при наведении на ссылку курсора мыши, используйте следующий код и деактивацию CSS text decoration underline :
a < text-decoration: none; >a:hover
Как отключить подсвечивание ссылок css
Как сделать так, чтобы ссылка НЕ имела свой собственный стиль, чтобы она принимала внешний вид родительского div?
Проблема в том, что родительский div имеет синий фон с белыми буквами. Поскольку это ссылка, она оформлена как ссылка с синими буквами, поэтому я получаю синий на синем.
Родительский стиль добавлен с помощью Javascript. Таким образом, родительский стиль иногда обозначается белыми буквами, а иногда — нет.
Мне нужна ссылка, чтобы сохранить тот же вид, что и родительский.
Вот как это выглядит при выборе:
Вот как это выглядит, когда он не выбран:
4 ответа
Вы не можете отменить стиль элемента, но вы можете применить стиль только тогда, когда у родителя есть определенный стиль, например:
Этот стиль будет применяться только тогда, когда он является дочерним элементом элемента с классом parentStyle.
Вы также можете использовать это, чтобы сделать ссылку не отличной от текста родительского элемента.
PS: Возможно, вам понадобится использовать больше стилей в зависимости от уже используемого CSS.
Как убрать эффект появления синего фона при нажатии на ссылку или кнопку?
Можете вместо * использовать более точечный селектор.
- Вконтакте
Евгений Романенко, да из разных. Всё те же, что и обычно: CSS Tricks, StackOverflow да MDN.
Ввожу запросы поиска на английском и всегда в Google.
Ну и ещё забыл, что я смотрю, как сделаны крутые современные сайты с хорошим бюджетом, чтобы понять, как что работает. Там можно тоже увидеть внезапные примеры.
Как сделать HTML ссылку некликабельной (неактивной)?
Пример CSS кода для создания некликабельной (неактивной) HTML ссылки. Добавляем в CSS код такую запись с классом:
В HTML коде устанавливаем для нективных ссылок класс disabled
Комментировать
СПАСИБО)) простой вариант решения)))
И зачем такие заморочки, если можно просто прописать ссылку, не добавляя
Есть 2 важных преимущества:
- Стилизация неактивной ссылки. Вам всё равно придется использовать CSS стили для того, чтобы скрыть подсветку ссылки при наведении курсора.
- Удобство для разработчика. Данный вариант удобен (необходим) при разработке веб-приложения, так так дает возможность задать стилизацию и быстро найти неактивные ссылки в коде.
Очень быстро нашел нужную информацию, большое спасибо.
Небольшая поправочка, команда pointer-events: none ; подойдёт на блокировки клика по JavaScript’ам с некоторых сайтов, при клике на скрипт идёт пересылка на сайт.
Это решение не будет работать в IE.
Для IE есть следующий метод, он немного хардкодный но работает) Ссылку можно обернуть в span и перекрыть кликабельность ссылки псевдоэлементом на span.
Спасибо! Интересный вариант решения проблемы для IE.
При работе на теме лаерс вордпресс есть возможность управлять CSS но нет возможности править HTML. Есть способ для ИЕ с помощью только CSS?
Спасибо! Лаконично и эффективно.
Подскажите, если в документе 3 ссылки. И надо, чтобы при нажатии на одну из них, остальные исчезали (именно ссылки исчезали, а не содержимое, которое внутри ссылок).
Т.е., есть раскрывающийся доп.текст при нажатии на фразы «да», «нет», «не знаю». Надо чтобы при нажатии допустим на «да», фразы «нет» и «не знаю» пропадали.
Программирую на уровне копипастера) вбил запрос в поисковик, нашел это решение и стал счастливее) Спасибо!
Как убрать подсветку ссылки при наведении (все перепробовал)? — Joomla 2.5: Общие вопросы
Бесплатный компонент карты сайта с поддержкой различных компонентов.
Вышел JoomShopping 4.18.8
— Исправление предупреждений (warning) с PHP 8.
Релиз плагина jYProExtra 1.8.0 с поддержкой Joomla 4
Плагин расширяющий возможности конструктора страниц YOOtheme Pro. Улучшение изображений, Встроенные файлы, Исключение модулей, Удаление JavaScript и многое другое.
Похожие публикации:
- Как обрезать фото css
- Как опустить футер вниз css
- Сколько весит css
- Чем html отличается от css