Псевдокласс focus задает стили для инпута, текстареа или ссылки с фокусом ввода. Фокус ввода - это когда мы нажали на инпут и там моргает курсор-палочка (можно вводить текст).

Синтаксис

input:focus {
	
}

Примеры

Пример

После получения фокуса инпут получит красную границу и тень (плавность изменения - это transition):

input:focus {
	border: 1px solid red;
	box-shadow: 0px 0px 3px red;
}

Результат выполнения кода: