Нежелательная схема или рамка вокруг кнопки при нажатии

У меня есть стильная кнопка на моем веб-сайте. Но когда я нажимаю на него, он создает нежелательную границу или контур (я не знаю, какой). Как удалить эту границу? Ниже приведен код, относящийся к кнопке.

button {
    border: hidden;
    cursor: pointer;
    outline: none;
}

<button>this is my button</button>

Ответы

Ответ 1

Если вы говорите о пунктирной линии в Firefox, я думаю, что вы ищете:

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

Это тема на тему: Как удалить пунктирную схему Firefox на BUTTONS, а также ссылки?

Ответ 2

Используйте любой из этих стилей CSS

a:active,
a:focus,
input,
input:active,
input:focus {
    outline: 0;
    outline-style:none;
    outline-width:0;
}  
a:active,
a:focus,
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
    border: none;
}

ИЛИ ЖЕ

:focus {outline:none;} ::-moz-focus-inner {border:0;}

Как только часть CSS Style будет готова, вам также может понадобиться установить IE-Emulator. Обновите файл web.config веб-приложений и включите ключ ниже.

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <clear />
      <add name="X-UA-Compatible" value="IE=7; IE=9; IE=8; IE=5;" />
    </customHeaders>
  </httpProtocol>

</system.webServer>

Ответ 3

outline: none;

Это работало для меня в Chrome.

Ответ 4

Это контур. Используйте outline:none; on: focus pseudo-class, чтобы удалить его. Хорошо работал у меня.

Ответ 5

Пожалуйста, не удаляйте контуры стилей фокусировки, это делает ваш сайт менее доступным для ваших пользователей с клавиатурой и с низким уровнем видимости.

Если вы хотите добавить что-то вроде :focus { outline: none; } в таблицы стилей, добавьте также стили для сфокусированных элементов.

Чтение: Никогда не удалять контуры CSS