Эффект наведения на кнопки-ссылки меню Divi Theme 👍👍👍

Тема Divi: меню, ссылки, границы, кнопки, эффект наведения. В этой серии видео мы будем использовать тему Divi для создания замечательных эффектов. Тема Divi обладает множеством отличных модулей и эффектов. Немного поработав, вы сможете добиться потрясающих, привлекательных эффектов, которые улучшат внешний вид и пользовательский опыт вашего сайта. Сегодня мы покажем, как создать эффект изменения цвета кнопки-границы при наведении курсора с помощью темы Divi. В этом видео не используются никакие дополнительные плагины. В сегодняшнем видео мы используем немного CSS-кода, чтобы стилизовать верхние пункты меню так, как нам нужно, чтобы они лучше сочетались с остальной частью сайта. Не пугайтесь CSS-кода, это очень просто, и любой код, который я напишу сегодня, я вставлю ниже видео, чтобы вы могли использовать его по своему усмотрению. Вы можете скопировать код и вставить его на свой сайт, CSS — это отличная вещь для изучения, поэтому я призываю вас попробовать свои силы, чтобы познакомиться с ним. С помощью CSS невозможно сломать свой сайт; если что-то не работает, просто удалите это, чтобы вернуть сайт в прежнее состояние. Итак, следуйте инструкциям в видео и посмотрите, как легко создать эффект рамки кнопки-ссылки меню при наведении курсора, используя тему Divi. Для получения дополнительной информации о теме Divi, ознакомьтесь с нашими плейлистами Divi ниже. Мой блог: https://web-design-and-tech-tips.com --------- ИСПОЛЬЗОВАННЫЙ СЕГОДНЯ КОД CSS --------- /* Пункты верхнего меню */ #top-menu li a { padding: 10px !important; margin-top: -10px; margin-bottom:30px; border: 1px solid #0D2B6F; border-radius: 4px; color: #0D2B6F; } #top-menu li a:hover { background:#0D2B6F; color:#fff !important; opacity:1 !important; } .current-menu-item a { background:#0D2B6F; color:#fff !important; } --------- РЕКОМЕНДУЕМЫЕ ПЛЕЙЛИСТЫ --------- Электронный магазин на Elementor:    • Elementor Ecommerce Store Woocommerce Inst...   Фрагменты кода Divi:    • Divi 4 Snippets Divi Theme Overview 👍   Электронный магазин на Divi 4:    • Divi 4 Ecommerce Store Theme Setup And Ove...   Основы Bootstrap 4:    • Bootstrap 4 Basics Index Page and External...   Elementor:    • Elementor Wordpress Builder Install And Ov...   Советы по WordPress:    • Wordpress 2020 Theme Customize The Page Ti...   --------- РЕКОМЕНДУЕМЫЕ ВИДЕО: --------- Полный учебник по созданию одностраничного сайта с прокруткой на Bootstrap 4:    • Bootstrap  Complete One Page Scrolling Web...   Создание одностраничного сайта с прокруткой в ​​Elementor WordPress за 15 минут:    • Elementor One Page Scrolling Site in 15 Mi...   Bootstrap - Как редактировать шаблон Bootstrap:    • EASY Bootstrap Template Customization Tuto...   Divi: Добавление прямой трансляции Facebook на ваш сайт Divi или любой сайт WordPress:    • Divi Add a live facebook feed to your divi...   Divi 4: Как создать многостраничный сайт за 20 минут:    • Divi 4 Theme How To Build A Multi Page Web...   Elementor WordPress Builder: Как создать секцию с эффектом параллакса:    • Elementor Wordpress Builder How To Build A...   --------- СОЦИАЛЬНЫЕ СЕТИ --------- Следите за моей деятельностью в: Facebook:   / system22.net   Twitter:   / 22itsolutions1   LinkedIn:   / jamie-henry-546b7377   Поддержите канал: https://paypal.me/system22 Курсы, которые я преподаю: https://www.udemy.com/user/jamiehenry2/ Подпишитесь:    / @system22   #YouTubeTips #WebDesignTips #FreeWebDesignTutorials #СоздайтеСобственныйВеб-сайт