• Гигабайты ценной информации. Присоединяйся.
    У нас действительно всё бесплатно, включая ChatGPT/DALLE/VISION)

[HTML Academy] Онлайн-курс «Анатомия CSS-каскада» (2022)

serafim

Житель Разулы
Команда форума
Разула в сердце
Регистрация
25 Апр 2016
Сообщения
78.841
Реакции
125.731
Ra
242.606
[HTML Academy] Онлайн-курс «Анатомия CSS-каскада» (2022)

Из обычного фронтендера в техлида

Курс создан для практикующих разработчиков, которые хотят повысить свою экспертизу и прокачать инженерное мышление. В курсе досконально разбираются фундаментальные механизмы CSS: обработка значений (value processing), каскад и наследование.

Программа курса
Курс проходит в асинхронном формате. Это значит, что вы можете начать обучение в любое время и двигаться по программе с комфортной вам скоростью.

Прохождение курса займёт от 2 до 3 недель, если вы готовы заниматься 5 часов в неделю.

Раздел 1. Обработка значений и каскад
Рассмотрим понятие каскада и обработки значений. Разберёмся, как браузер вычисляет значения, и в какой момент запускается каскад.

Теория
  • Понятие каскада. Вычисление значений: стадии declared, cascaded, specified, computed, used и actual.
Практика
  • Контрольные тесты по темам раздела
Раздел 2. Фильтрация
Поговорим о стилях автора, пользователя и браузера, а также о «виртуальных» стилях. Разберём, как браузер парсит CSS-код, фильтрует объявления и отбирает значения. Коснёмся валидности, префиксов, псевдонимов, условных правил и поиска элементов в DOM-дереве.

Теория
  • Источники стилей: авторские, браузерные и пользовательские. Парсинг и фильтрация.
Практика
  • Контрольные тесты по темам раздела
Раздел 3. Каскад
Детально рассмотрим порядок объявления свойств и каскадирования. Разберёмся с тем, как происходит расчёт специфичности селекторов и какую роль она играет в каскаде.

Теория
  • Детальный разбор алгоритма каскада. Порядок подключения стилевых файлов и объявления свойств. Порядок каскадирования: в какой очерёдности применяются стилевые правила. Аннотация !important. Cелекторы и расчёт специфичности.
Практика
  • Контрольные тесты по темам раздела
Раздел 4. Получение значений по умолчанию
Посмотрим, что происходит, если не задать значение явно. Разберёмся с наследуемыми и ненаследуемыми свойствами и значениями по умолчанию. Рассмотрим наследование кастомных свойств и способы повернуть каскад вспять.

Теория
  • Наследуемые и ненаследуемые свойства. Значения по умолчанию. Кастомные свойства. Принудительное наследование. Ключевое слово inherit. Откат каскада. Ключевые слова revert, unset, initial. Свойство all.
Практика
  • Контрольные тесты по темам раздела
Раздел 5. Вычисления
Разберёмся, что происходит с каскадированными значениями дальше, как они вычисляются в конкретные значения, используемые для отрисовки в браузере.

Теория
  • Этапы вычислений: computed, used, actual value.
Практика
  • Контрольные тесты по темам раздела
Раздел 6. Каскад на практике
Поработаем с каскадом на практике. В подробных пошаговых демонстрациях разберём реализацию типовых приемов и компонентов.

Теория
  • Свойство font-size-adjust. Стилизация компонента спиннера. Стилизация кастомных компонентов. «Липкий» подвал страницы. Функции для вычислений в CSS.
Итоговое испытание
Вам нужно будет выполнить задание – реализовать алгоритм каскада на JavaScript, используя все полученные знания о CSS-каскаде.

Результат выполнения контролирует автоматизированная система проверки.

КУПИТЬ
Онлайн-курс «Анатомия CSS-каскада» для опытных разработчиков, HTML Academy
СКАЧАТЬ
 
Сверху