Отключить выделение синего текста в поле Chrome Extension? - PullRequest
Новая
       39

Отключить выделение синего текста в поле Chrome Extension?

4 голосов
/ 26 февраля 2012

Я работаю над расширением Chrome, которое позволяет вам редактировать небольшое текстовое поле, и я нахожу синюю подсветку вокруг текстового поля, когда щелкаю по-настоящему раздражающим.

Есть ли способ (желательно с использованием CSS) сделать эту подсветку немного тоньше? Я считаю, что он слишком толстый и нуждается в похудении. Спасибо!

Снимок экрана с синей подсветкой:

enter image description here

1 Ответ

11 голосов
/ 26 февраля 2012

Да; просто присвойте 'none' свойству 'outline': 

input {
    outline: none;
}

JS Fiddle demo .

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

<ч />

Отредактировано в ответ на комментарий, оставленный Бикром, ФП, в комментариях ниже:

Я собирался отключить / изменить его, чтобы посмотреть, что он может сделать.

Чтобы настроить стиль для outline, вы можете получить доступ к отдельным свойствам: 

elementSelector:focus {
    outline-width: 4px; /* thin, medium, thick or standard CSS length units */
    outline-style: auto; /* or 'inherit', 'none' or border-style (solid, dashed, dotted...) */
    outline-color: #f90; /* standard CSS colors */
}

JS Fiddle demo .

Вышеприведенное также можно сжать, используя сокращенную запись: 

elementSelector:focus {
    outline: 4px auto #f90;
}

Наименьшее из возможных контурных измерений, которые можно использовать: 

elementSelector:focus {
    outline-width: thin; /* or 1px */
}
...