Перейти к содержимому













Фотография
Скачать

[HTML Academy] Анатомия CSS-каскада (2022)



  • Авторизуйтесь для ответа в теме
В этой теме нет ответов

#1 НЛО

НЛО

    Запись опубликована анонимно ✔

  • Сливапер LVL 6
  • Сообщений: 26 694
  • Регистрация: 04.06.2018
  • Заработано: 10 232 руб.
Репутация: 12 617

Награды: 55

  
  
  
  
  
  
  
  

Отправлено 23 Март 2022 - 19:02

Название: Анатомия CSS-каскада (2022)

Автор: HTML Academy


Курс создан для практикующих разработчиков, которые хотят повысить свою экспертизу и прокачать инженерное мышление. В курсе досконально разбираются фундаментальные механизмы 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-каскаде.

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


Anonymous poster hash: 4d024...0a2


Скрытый контент:

  Для просмотра необходимо войти или зарегистрироваться


Скачать:

Скрытый контент:

  Для просмотра содержимого необходимо 531 очков репутации (вам не хватает 531)

 Скачать без ограничений   Купить этот материал за 390 руб.



🔔 Подпишись на наш канал telegram @slivup_live и бота @kurs_slivup, что бы следить за крутыми новинками форума

  • 0



Похожие темы Collapse

Количество пользователей, читающих эту тему: 1

0 пользователей, 1 гостей, 0 анонимных

×

Зарегистрируйся моментально!