CSS selector input:focus
Селектор :focus використовується для вибірки елеметів, що потрапили у фокус.
Елемент отримує фокус, коли ви встановлюєте курсор в поле введення. При цьому в полі з'являється мигаючий курсор.
Синтаксис
:focus {
css declarations;
}Переглядачі
| Переглядач | |||||
|---|---|---|---|---|---|
| focus | 4.0 |
8.0 |
2.0 |
3.1 |
9.6 |
Мобільних переглядачів ще не додано.
Мобільних переглядачів ще не додано.
Приклади
Обирає елемент <input>, який є у фокусі, і визначає його стиль
input:focus {
background-color: yellow;
}Коли <input type="text"> отримує фокус, його ширина поступово змінюється з 100px до 250px
input[type=text] {
width: 100px;
transition: ease-in-out, width .35s ease-in-out;
}
input[type=text]:focus {
width: 250px;
}