Kастомный код работает только на платных планах (кроме архивного плана Creator). На плане Free кастомный код будет отображаться только в режиме превью и не будет работать после публикации.
В режиме наложения верхний слой изменяет отображение контента, расположенного под ним. Давайте посмотрим на практике, как это это работает:
- Загрузите файл через виджет Picture («Изображение») и добавьте текстовый виджет поверх него. Выберите подходящий цвет для текста (в нашем примере используется белый цвет).
- Найдите ID текстового виджета по инструкции здесь.
- Добавьте виджет Code («Код») и вставьте код, указанный ниже, во вкладку CSS. Не забудьте заменить фрагмент
"PASTE WIDGET ID HERE"на ID виджета из пункта 2, но оставьте кавычки.
Данный код работает только в десктопной версии проекта.
[data-id="PASTE WIDGET ID HERE"] {
mix-blend-mode: difference;
}
В спецификации CSS существует несколько десятков различных эффектов наложения. Узнать больше о свойстве mix-blend-mode вы можете в документации MDN Web Docs.