Применение псевдокласса focus
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<style type="text/css">
INPUT:focus {
color: red /* Красный цвет текста */
}
</style>
</head>
<body>
<form>
<input type="text" value="Черный текст">
</form>
</body>
</html>
Результат примера показан ниже.
input.ex:focus {color: red}
В данном примере в текстовом поле содержится предварительный текст, он определяется значением параметра value тега <INPUT>. При щелчке по элементу формы происходит получение полем фокуса, и цвет текста меняется на красный. Достаточно щелкнуть в любом месте страницы (кроме текстового поля, естественно), как произойдет потеря фокуса и текст вернется к первоначальному черному цвету.
Замечание 1
Результат будет виден только для тех элементов, которые могут получить фокус. В частности, это теги <A>, <INPUT>, <SELECT> и <TEXTAREA>.
Замечание 2
Псевдокласс focus не поддерживается браузером Internet Explorer.
