Пример 1
Как стилизовать текстовые поля, когда они получают фокус:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
input:focus { background-color:yellow; }
</style>
</head>
<body>
<p>Нажмите внутри полей ввода, чтобы увидеть желтый фон:</p>
<form>
Имя: <input type="text" name="firstname" />
<br />
<br />
Фамилия: <input type="text" name="lastname" />
</form>
</body>
</html>
Определение и использование
Селектор :focus стилизует элемент, который получает фокус.
Совет: Селектор :focus допускается на элементы, которые принимают события клавиатуры.
Поддержка браузеров
Селектор :focus поддерживается во всех ведущих браузерах.
Примечание: Для того, чтобы :focus работал в IE, необходимо указать !DOCTYPE.
Версия CSS
Селектор :focus впервые представлен в: CSS 1
Связанные страницы
Пособие по CSS: CSS Псевдо-классы
Была ли эта информация полезной?
