Как вы измените CSS текстового ввода при выборе?

Question

Я хочу изменить CSS <input type="text">, когда выделено текстовое поле; то есть когда пользователь нажимает на текстовое поле, я хочу применить другие правила CSS. Есть ли способ сделать это с помощью чистого CSS?

Answer 1

Вы уже пробовали фокус псевдокласса

:focus 

подробнее: http://reference.sitepoint.com/css/pseudoclass-focus

Answer 2

выберите поля ввода, имеющие только атрибут текста

input[type="text"]:focus{background-color:yellow;}

Выберите любое поле ввода (флажок, файл, скрытый, изображение, пароль, радио, сброс, отправка, текст)

input:focus{background-color:yellow;}

Выберите любую текстовую область

textarea:focus{background-color:yellow;}

Хорошо, это с помощью CSS, однако, если вы хотите добиться плавных анимированных эффектов и лучше контролировать фокусировку / размытие, лучше использовать JQuery или другие JavaScript-фреймворки.1010 *

Answer 3

<script>
function change(objNum){
    var objName = "txtbox";
    window.alert(objNum);

    document.getElementByID(objName).className = "franchlinks";

}
</script>

<input type="text" class="yourdefaultclass" id="txtbox1" onclick="change('txtbox1');">

Попробуй вот так. в случае потери фокуса вы можете попробовать onblur вместо onclick.

Answer 4

Вы можете использовать следующее в CSS

E :: selection

, где E - элемент.

http://www.456bereastreet.com/archive/200601/css_3_selectors_explained/

Вы также можете использовать jquery, используя

$('#element').attr('class', 'new value');

Answer 5

Да.Выберите его, используя псевдокласс :focus.

Демонстрация на http://dabblet.com/gist/1490497