3

В Firefox есть пунктирная граница вокруг элемента, когда он имеет фокус. Иногда я нахожу это невозможным. Какие настройки Firefox мы можем использовать, чтобы сделать фокус более очевидным.

Обратите внимание, что я хочу сделать это через настройку Firefox, НЕ редактируя CSS сайта.

Например, в SuperUser, когда кнопки «Вопросы», «Теги», «Пользователи», «Значки» или «Без ответа» находятся в фокусе, пунктирная граница полностью не видна. Как я могу сделать границу, скажем, принести розовый или красный и шириной 5 пикселей?

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

Поверите ли вы, что ссылка Вопросы находится в фокусе.

Я бы предпочел, чтобы в фокусе это выглядело, изменив некоторые настройки Firefox.

2 ответа2

3

Вы можете определить свои собственные стили по умолчанию, добавив их в <каталог профиля Firefox>\chrome\usercontent.css. Любые сделанные вами изменения вступят в силу при следующем запуске профиля (поэтому, если вы используете его во время редактирования этого файла, вам придется перезапустить его).

Добавив следующее в usercontent.css моего профиля:

:focus {
  outline: #FF5500 dashed 2px;
}

Я получаю следующее:



Несколько заметок:

  • usercontent.css определяет только стили по умолчанию, которые используются, когда на веб-странице не определены конфликтующие стили. Таким образом, это работает в тех случаях , когда фокус контур спрятанные на случай непредвиденных причины (такие , как использование изображения кнопок, как на этой странице), но это не будет работать , если веб - сайт автор намеренно определил стиль CSS , который отключает контур фокусировки либо для данного элемента, либо для всей веб-страницы. Повсеместно считается плохой практикой отключать контур фокуса, не определяя альтернативные способы различения сфокусированного элемента, но, к сожалению, это слишком распространено.

  • Если вы не видите подкаталог chrome в каталоге профиля и / или не видите файл usercontent.css в этом подкаталоге, просто создайте их.

  • Вы можете найти каталог профиля, введя about:support в адресную строку (или выбрав пункт « Устранение неполадок» в меню « Справка» ), а затем нажав кнопку « Показать папку» в разделе « Основные сведения о приложении ».

1

Вы можете использовать Стильный, чтобы установить другой стиль фокуса. Что-то вроде этого:

:focus {
    outline: 3px solid red;
}

Результат будет выглядеть так:

Всё ещё ищете ответ? Посмотрите другие вопросы с метками .