Как изменить цвет переключателя при наведении курсора

Question

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

мой код CSS:

 input:focus, input:hover, textarea:focus, textarea:hover {
 border: 0 none;
 background: blue;
 }

Answer 1

powerbuoy прав насчет того, что селектор ввода выбирает флажки и радио в дополнение к обычным текстовым полям.
но у меня есть предложение, которое вы можете использовать вместо его, которое будет работать в других браузерах.
в основном вы можете добавить класс ко всем вашим флажкам и переключателям.
поэтому ваш флажок и радио HTML становится

<input type="checkbox" class="checkbox">
<input type="radio" class="radio">

, а затем добавьте CSS, чтобы сбросить стиль для флажков и радио, как это

input.checkbox, input.radio
{
    background:transparent;
}

Answer 2

Поскольку вы стилизуете input напрямую, радиокнопки и флажки также будут нацелены.Самый простой способ избежать этого - использовать селектор :not() следующим образом: input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=image]):not([type=button]):focus.Обратите внимание, что это не работает в IE <8 (?). </p>