О тесте: что вы узнаете
Онлайн-тест по адаптивной CSS-вёрстке: Grid, Flexbox, медиазапросы, размеры, переполнение и доступность интерфейса. 90 вопросов с объяснениями. За попытку выбираются 30 разных заданий: 10 базовых, 10 прикладных и 10 усложнённых, из банка 90 вопросов. Результат содержит объяснения всех ответов.
Какие навыки проверяются
- Flexbox и Grid
- Адаптивные размеры и медиаусловия
- Переполнение, фокус и доступность
Сетка карточек
Как сделать так, чтобы при уменьшении ширины каталога количество колонок менялось само?
Как рассуждать: Используйте CSS Grid с repeat(auto-fit, minmax(...)): браузер автоматически подбирает количество помещающихся колонок.
Это ознакомительный пример, а не ответ к текущему варианту теста.
Выбирайте систему раскладки по задаче
Flexbox удобен для строк и колонок элементов, Grid — для двумерных схем. Не заменяйте гибкую сетку абсолютными позициями для обычных карточек.
Проверяйте реальные экраны
Тестируйте 320–375 px, планшет и десктоп; проверяйте длинные надписи, работу с клавиатурой и reduced motion. Одних медиаусловий недостаточно без гибких размеров.
Частые вопросы
Сколько вопросов в тесте «CSS Flexbox, Grid и адаптивная вёрстка: тест»?
В одной попытке 30 заданий из банка 90 вопросов — по 10 на каждый уровень сложности. При повторном запуске программа старается не повторять задания предыдущей попытки.
Как оцениваются ответы в тесте «CSS Flexbox, Grid и адаптивная вёрстка: тест»?
За правильный выбор начисляется один балл, за пропуск или ошибку — ноль. После завершения доступны общий процент, результаты по уровням сложности и объяснения.
Что использовать для самостоятельного изучения темы?
В справочнике MDN есть примеры CSS Grid, Flexbox, container queries, единиц размера и требований доступности.
Закрепите навык в тренажёре
После теста можно перейти к упражнениям и попрактиковаться без оценки или регистрации.