Убираем рамку вокруг ссылки в Mozilla Firefox и Internet Explorer

Seditio.by » Наш блог » HTML и CSS » Убираем рамку вокруг ссылки в Mozilla Firefox и Internet Explorer

Пунктирная рамка вокруг ссылок в популярных браузерах Mozilla Firefox и Internet Explorer раздражает многих посетителей веб-сайтов. Поэтому для того, чтобы ваши потенциальные заказчики или клиенты были довольны на 100%, об этом вопросе необходимо позаботиться.

Решение 1: JavaScript

for(var i=0; i<document.links.length; i++) {
   document.links[i].onfocus = function() {this.blur();};
}

Из-за зависимости от JS и потенциально возможного замедления загрузки веб-сайта, далеко не лучший выход из положения.

Решение 2: Псевдокласс :focus

a:focus	{ -moz-outline-style:none; }

Становится теплее. Данный css-код нацелен только на браузеры, базирующиеся на Mozilla. Для пользователей Internet Explorer придется использовать совершенно непродуктивное Решение 1.

Решение 3: Чистый CSS

Здесь существует несколько вариаций, но, чтобы не томить, приведу универсальное решение:

a 	{ outline:none; }

Дополнительно к outlne в свойствах можно указать все, что угодно. Данное решение эффективно работает по обе стороны баррикад: как в Firefox, так и в Internet Explorer.