Стань PHP-разработчиком с нуля с трудоустройством в IT-компании

Дерево навыков/Фильтры и композиция/ Композиция и смешивание

  1. Базовый уровень

    • Group opacity

      Применяет `opacity` к итоговой группе элемента, а не отдельно к цвету каждого descendant.

    • Смешивание элемента

      Выбирает режим смешивания элемента с его backdrop через `mix-blend-mode`.

    • Смешивание фонов

      Выбирает режимы смешивания background layers через `background-blend-mode`.

  2. Продвинутый уровень

    • Source и backdrop

      Различает новое source image и уже скомпонованный backdrop.

    • Opacity group

      Формирует промежуточную группу перед применением opacity к descendants.

    • Область `mix-blend-mode`

      Определяет backdrop, с которым смешивается конкретный элемент.

    • Область background blending

      Ограничивает background blending слоями и background color одного элемента.

    • Списки blend modes

      Сопоставляет и повторяет значения `background-blend-mode` по числу background images.

    • Изоляция

      Создаёт изолированную compositing group через `isolation: isolate`.

    • Stacking-context group

      Учитывает изоляцию compositing group, вызванную созданием stacking context.

    • Masks и filters

      Отличает compositing group от mask/filter effect и соблюдает порядок их применения.

  3. Экспертный уровень

    • Alpha coverage

      Определяет вклад source и backdrop по их alpha coverage.

    • Premultiplied color

      Преобразует между обычными и premultiplied color components.

    • Source-over

      Вычисляет итоговые color и alpha для source-over.

    • Porter–Duff factors

      Определяет вклад source и backdrop через коэффициенты выбранного Porter–Duff operator.

    • Blend и composite

      Выполняет blending color перед Porter–Duff compositing.

    • Compositing groups

      Сворачивает содержимое группы в единое color/alpha image перед внешней композицией.

    • Group invariance

      Определяет, когда добавление нейтральной группы не меняет визуальный результат.

    • Изолированный backdrop

      Использует transparent-black initial backdrop внутри изолированной группы.

    • Неизолированный backdrop

      Передаёт group backdrop как initial backdrop неизолированной группы без двойного вклада.

    • Итоговый alpha

      Восстанавливает результирующий alpha независимо от последующего извлечения непреумноженного цвета.