Как удалить контур вокруг изображений гиперссылок?

Когда мы используем замену текста с помощью CSS и получаем отрицательный отступ теста, т.е. text-indent:-9999px. Затем, когда мы нажимаем на эту ссылку, линия Dotted появляется, как на образце ниже. Какое решение для этого?

Ответ 1

Для удаления контуров для тега привязки

a {outline : none;}

Удалить контур из ссылки изображения

a img {outline : none;}

Удалить границу из ссылки изображения

img {border : 0;}

Ответ 2

Вы можете использовать свойство CSS "контур" и значение "none" в элементе привязки.

a {
outline: none;
}

Надеюсь, что это поможет.

Ответ 3

Для Internet Explorer 9:

a:active, a:focus { 
 outline: none; 
 ie-dummy: expression(this.hideFocus=true);
}

Источник: http://social.msdn.microsoft.com/Forums/en-HK/ieextensiondevelopment/thread/1023adfd-bd73-47ac-ba9c-2bad19ac583a

Ответ 4

Обратите внимание, что стили фокусировки существуют по какой-либо причине: если вы решили удалить их, люди, которые перемещаются по клавиатуре, не знают, что в фокусе больше, поэтому вы нарушаете доступность своего веб-сайта.

(Сохранение их на месте также помогает владеть пользователями, которые не любят использовать их мышь)

Ответ 5

В Firefox и браузере Internet Explorer (IE) есть тот же эффект границы, который становится видимым при нажатии на какую-либо ссылку.

Этот код исправит только IE:

a:active { outline: none; }.

И этот исправить Firefox и IE:

:active, :focus { outline: none; -moz-outline-style: none; }

Последний код следует добавить в таблицу стилей, если вы хотите удалить границы ссылок с вашего сайта.

Ответ 6

включить этот код в таблицу стилей

img {border : 0;}

a img {outline : none;}

Ответ 7

Я надеюсь, что это полезно для некоторых из вас, его можно использовать для удаления контура из ссылок, изображений и вспышки и из MSIE 9:

    a, a:hover, a:active, a:focus, a img, object, embed {
    outline: none;
    ie-dummy: expression(this.hideFocus=true); /* MSIE - Microsoft Internet Explorer 9 remove outline */
    }

Код ниже может скрыть границу изображения:

    img {
    border: 0;
    }

Если вы хотите поддерживать Firefox 3.6.8, но не Firefox 4... При нажатии на тип ввода = изображение может также создавать пунктирный контур, чтобы удалить его в старых версиях Firefox, трюк:

   input::-moz-focus-inner { 
   border: 0; 
   }

IE 9 не позволяет в некоторых случаях удалять пунктирный контур вокруг ссылок, если вы не включили этот метатег между страницами и на своих страницах:

     <meta http-equiv="X-UA-Compatible" content="IE=9" />

Ответ 8

-moz-user-focus: ignore; в браузерах на базе Gecko (возможно, вам понадобится! важно, в зависимости от того, как они применяются)

Ответ 9

Вы можете поместить overflow:hidden в свойство с отступом текста, и эта пунктирная линия, которая простирается от страницы, исчезнет.

Я видел пару сообщений об удалении контуров вместе. Будьте осторожны при этом, так как вы можете снизить доступность сайта.

a:active { outline: none; }

Я лично использовал бы этот атрибут только, как если бы атрибут :hover имел те же свойства css, что предотвратит отображение контуров для людей, которые используют клавиатуру для навигации.

Надеюсь, что это решает вашу проблему.

Ответ 10

Используйте Like This для HTML 4.01

<img src="image.gif" border="0">

Ответ 11

Это последний, который работает в Google Chrome

:link:focus, :visited:focus {outline: none;}

Ответ 12

Я бы пообещал, что большинство пользователей - это не тот тип пользователя, который использует клавиатуру в качестве навигационного элемента управления. Является ли приемлемым раздражать большинство ваших пользователей для небольшой группы, которая предпочитает использовать навигацию на клавиатуре? Короткий ответ - зависит от того, кто ваши пользователи.

Кроме того, я не вижу подобного опыта в Firefox и Safari. Таким образом, этот аргумент, по-видимому, в основном относится к IE. Все это зависит от вашей базы пользователей и их уровня знаний - как они используют сайт.

Если вы действительно хотите знать, где вы находитесь, и вы являетесь пользователем клавиатуры, вы всегда можете смотреть на строку состояния, когда вы вводите ключ через сайт.

Ответ 13

Это отлично работает для меня

a img {border:none;}

Ответ 14

Любое изображение, у которого есть ссылка, будет иметь границу вокруг изображения, чтобы указать, что это ссылка со старыми браузерами. Добавление border = "0" в ваш HTML-тег IMG не позволит этому изображению иметь границу вокруг изображения.

Однако добавление border = "0" к каждому изображению будет не только трудоемким, но также увеличит размер файла и время загрузки. Если вы не хотите, чтобы на ваших изображениях была граница, создайте правило CSS или CSS файл, в котором есть код ниже.

img {border-style: none; }

Ответ 15

чтобы удалить ссылку Dotted Outline href, которую вы можете записать в файле css:

a {
   outline: 0;
}

Ответ 16

Да, мы можем использовать. CSS reset как a {outline:none}, а также

a:focus, a:active {outline:none} для лучшей практики по сбросу CSS, лучшее решение использует общий :focus{outline:none} Если у вас все еще есть лучший вариант, пожалуйста, поделитесь