← Веб: HTML и CSS

⇄ Перенос
Длительность

Программа
История и перенос прогресса
Выбери тему — задачи будут идти одна за другой, пока не надоест

Теория всех шагов программы по блокам. Открой тему, чтобы прочитать.

Как проходит занятие

Занятие — 10–90 минут: разминка по пройденному, новые шаги с короткой теорией и задачами, практика. У каждой задачи две попытки: с первой — 100 очков, со второй — 60, после второй ошибки показывается правильный ответ. Дальше по программе — если решено 70 % заданий.

Задачи с числами генерируются заново при каждом повторе шага. Дробный ответ можно вводить через запятую, точку или дробью: 0,5, 0.5, 1/2. В тренажёре любая тема без таймера.

О курсе

Структура документа и семантика, текст, таблицы и формы, доступность; селекторы, специфичность и каскад, единицы и цвета; блочная модель, display, position, flexbox и grid; адаптивная вёрстка, переменные CSS, псевдоклассы, переходы и анимации, БЭМ. Размеры и цвета в задачах проверены в настоящем браузере.

Программа курса: 31 урок

Основы HTML

  1. Структура документа
  2. Семантические теги
  3. Текст, ссылки и списки
  4. Таблицы
  5. Формы
  6. Доступность
  7. HTML: смешанная тренировка
  8. Контроль: HTML

Основы CSS

  1. Подключение и синтаксис CSS
  2. Селекторы
  3. Специфичность
  4. Каскад и наследование
  5. Единицы измерения
  6. Цвета и шрифты
  7. CSS: смешанная тренировка
  8. Контроль: основы CSS

Вёрстка

  1. Блочная модель
  2. display и поток документа
  3. position и z-index
  4. Flexbox: размеры
  5. Flexbox: выравнивание
  6. Grid
  7. Вёрстка: смешанная тренировка
  8. Контроль: вёрстка

Адаптив и эффекты

  1. Адаптивная вёрстка
  2. Переменные CSS и calc()
  3. Псевдоклассы и псевдоэлементы
  4. Переходы и анимации
  5. Именование классов: БЭМ
  6. Итоговая тренировка
  7. Контроль: адаптив и эффекты