Эффект матового стекла в Divi 5 — создайте этот ПОТРЯСАЮЩИЙ дизайн без программирования!
System 22 Web Design | Divi Theme Elementor WP
0:00 / 0:00
Эффект матового стекла в Divi 5 — создайте этот ПОТРЯСАЮЩИЙ дизайн без программирования!
1 129 просмотров · 2 недели назад
System 22 Web Design | Divi Theme Elementor WP
28,9 тыс. подписчиков
1 129 просмотров · 2 недели назад
Эффект матового стекла в Divi 5 — создайте этот ПОТРЯСАЮЩИЙ эффект без кода! Хотите создать красивый эффект матового стекла в Divi 5? В этом уроке мы покажем вам, как создать этот современный, привлекательный эффект практически на любой строке или модуле Divi 5 — и самое лучшее, что вам не понадобится никакой код!
Используя мощную новую функцию фильтра фона в Divi 5, мы возьмем фоновое изображение, размоем его, а затем объединим с цветом и прозрачностью, чтобы создать стильный эффект матового стекла или эффект «стекломорфизма».
Это фантастический способ придать вашим сайтам на Divi 5 более современный и премиальный вид.
Мы покажем вам, как применить эффект к строке или модулю и контролировать степень размытия фона, чтобы добиться именно того эффекта, который вы хотите. Мы также добавим цвет к элементу, чтобы создать классический эффект матового стекла, где фон остается видимым, но красиво размывается за контентом.
В результате получается изысканный эффект «стеклянного морфинга», который можно использовать для главных разделов, блоков контента, карточек, призывов к действию, меню, таблиц цен, наложений изображений и многого другого.
А поскольку мы используем встроенный фильтр фона Divi 5, нет необходимости писать собственный CSS или JavaScript.
В этом уроке вы узнаете:
• Как создать эффект матового стекла в Divi 5
• Как использовать новый фильтр фона
• Как размыть фоновое изображение
• Как добавить цвет и прозрачность
• Как создать эффект «стеклянного морфинга»
• Как применить эффект к строкам и модулям
• Как создавать современные дизайны Divi 5 без кода
• Как быстро создавать стильные фоновые эффекты
• Как настроить интенсивность размытия
• Как использовать эффекты матового стекла на всем вашем веб-сайте
Это еще один отличный пример того, как Divi 5 значительно упрощает создание сложных эффектов веб-дизайна. То, что раньше требовало пользовательского CSS, теперь можно сделать непосредственно через визуальный конструктор.
Если вы ищете быстрый способ придать вашему сайту на Divi 5 более современный вид, эффект матового стекла определенно стоит попробовать.
ТЕМЫ И ПЛАГИНЫ, ИСПОЛЬЗУЕМЫЕ В ЭТИХ ВИДЕО
Попробуйте тему Divi: https://bit.ly/TryDiviNow
Скидка 10% на плагин Divi Supreme Modules Pro: https://divisupreme.com/system22/?ref=6
Плагин Divi Supreme Modules Light: https://bit.ly/SupremeFreeVersion
Изображения, созданные с помощью ИИ в Nightcafe: https://creator.nightcafe.studio?fpr=...
Используйте промокод SYSTEM22NC для скидки 15%
РАЗДЕЛЫ
0:00 - Введение в эффект «матового стекла»
0:40 - Настройка раздела и фонового изображения
1:45 - Настройка высоты раздела и параллакса
2:50 - Создание эффекта «матового стекла» на модуле
3:35 - Добавление размытия фона с помощью фильтров Divi 5
4:20 - Расширение стилей на другие модули
5:00 - Применение эффекта ко всей строке
6:20 - Настройка цветов для темных эффектов с эффектом инея
6:45 - Заключительный предварительный просмотр и вывод
МОИ ПЛЕЙЛИСТЫ НА YOUTUBE:
Divi 5: • Divi 5
Полное руководство по Divi для начинающих: • Divi Ultimate Guide For Getting Started
Divi 5 для начинающих: • Divi 5 For Beginners
Divi 4 для начинающих: • Divi For Beginners
Модули Divi Supreme: / watch
v=ZAO2MH0dQtk&list=PLqabIl8dx2wo8rcs-fkk5tnBDyHthjiLw
Плейлист по созданию полнофункционального интернет-магазина: / watch
v=rNhjGUsnC3E&list=PLqabIl8dx2wq6ySkW_gPjiPrufojD4la9
Посмотрите нашу страницу плейлистов, чтобы найти больше видео по этой теме: / system22net
Не забудьте задать любые вопросы ниже, я постараюсь ответить или сделать для вас видеодемонстрацию!
Подписка: / @system22
МОЙ БЛОГ
https://web-design-and-tech-tips.com
Отказ от ответственности: Некоторые из этих ссылок являются партнерскими, и я получу небольшую комиссию, если вы совершите покупку, без дополнительных затрат с вашей стороны.