.action:active { transform: translateY(1px); }Смещение на один пиксель даёт краткий отклик на нажатие.
УРОК 82 ИЗ 100
Подтвердите нажатие через :active
Слегка сместите кнопку во время активации.
ШАГ 1 · ИЗУЧИТЕ
Как это работает
:active соответствует состоянию активации элемента, обычно между нажатием и отпусканием устройства ввода. Визуальная трансформация не меняет порядок документа.
.action { transform: translateY(1px); }Постоянная трансформация больше не сообщает момент активации.
ШАГ 2 · ПРИМЕНИТЕ
Ваше задание
Примените transform: translateY(1px) только к .action:active.
index.htmlCSS
Безопасный результатизолировано
Черновик хранится только в этом браузере.HTML и CSS разрешены · скрипты и сеть заблокированы
ШАГ 4 · ПРОВЕРЬТЕ
Что должно пройти
0%не проверено
- ○Состояние active смещает кнопку на 1px.
- ○Целевой элемент присутствует на странице.
Объясните логику решения
Псевдокласс ограничивает трансформацию активным состоянием, без JavaScript и изменения структуры.