Блог «НаМаксимум» | Максим Климков
Модификации

Как сделать градиентный общий фон у нескольких блоков?

Подробная текстовая инструкция + html-код к видео о том, как сделать общий градиентный фон у нескольких блоков на Тильде. Для фона также можно использовать картинку

Как это сделать?


  1. Создать необходимые zero и (или) стандартные блоки
  2. В коде прописать ID нужных блоков через запятую
  3. Задать общий класс этим блокам. Можете оставить класс, который уже прописан в коде — «new»
  4. Задать стили нашим блокам:

Важно! Не забудьте у каждого из блоков убрать фоновую заливку!

  • Для фона, который должен быть картинкой, используйте следующий код, в котором прописываете ссылку на картинку:
background-image: url('https://static.tildacdn.com/example') !important;

  • Для фона градиентом используйте следующий код, в котором меняете угол наклона, HEX-код цветов и их прозрачность:
background-image: linear-gradient(47deg, rgba(255,194,194,1) 0%, rgba(245,103,103,1) 48%, rgba(255,105,105,1) 100%) !important;

HTML-код:


<script>
$('#rec467776616, #rec467742445').wrapAll('<div class="new"></div>');
</script>
<style>
.new {
background-color: unset !important;
background-image: url('https://static.tildacdn.com/example') !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: cover;
}
</style>

Готово! Теперь у Ваших блоков общий фон, который везде состыкован и смотрится очень красиво!

Если остались вопросы или Вы хотите заказать продающий лендинг, то напишите мне в соцсетях или в комментариях под видео.

Контакты: Telegram | Вконтакте
Сайт — maxklimkov.ru
Made on
Tilda