Как скруглить углы в тильде
Перейти к содержимому

Как скруглить углы в тильде

  • автор:

Как кастомизировать элемент shape в Zero Block TILDA?

Что бы указать класс у элемента, нажимаешь на него правой кнопкой мыши и выбираешь из списка последнюю строку «Add CSS Class Name», далее, справа в настройках указываешь тот же класс что и в генераторе;

2. Настраиваем размытие шейпа.

3. Настраиваем размер скругления нужных углов;

4. Настраиваем размытие фона. Здесь нужно обязательно указать цвет и прозрачность. Цвет и прозрачности внутри настроек зеро блока не будут учитываться.

4. Настраиваем внутреннюю тень;

5. Настраиваем градиент;

6. Копируем сгенерированный HTML код и вставляем его в CSS-СТИЛИ;

CSS-СТИЛИ находятся в Настройки сайта-Ещё-CSS-СТИЛИ

Конечный шейп со всеми настройками будет отображаться в редакторе и на опубликованной странице, внутри Зеро Блока увидеть получившиеся настройки нельзя((

Как закруглить углы в тильде

Чтобы закруглить углы элементов на странице Tilda, выполните следующие действия:

  1. Откройте страницу, на которой нужно закруглить углы элементов.
  2. Выберите элемент, углы которого нужно закруглить.
  3. Откройте настройки элемента, нажав на иконку карандаша.
  4. Найдите раздел «Оформление» и выберите опцию «Изменить стиль».
  5. В разделе «Границы» выберите опцию «Скругленные углы» и настройте радиус скругления углов.
  6. Сохраните настройки элемента и проверьте изменения на странице.

Обратите внимание, что не все элементы на странице поддерживают скругление углов. Например, у кнопок с текстом скругление углов отсутствует. Кроме того, при использовании скругления углов на элементах, таких как картинки, может происходить обрезание изображения. Поэтому рекомендуется использовать скругление углов осторожно и с учетом особенностей дизайна.

Как скруглить углы в шейпах и картинках с разным значением?

Кастомизация углов в шейпах, картинках и кнопках. Модификация позволяет скруглить каждый угол элемента со своим значением

Генератор кода

  • Инструкция
  • Пример

1. Создаем в Zero Block шейп, картинку или кнопку и назначаем элементу класс tc-custom-radius
Чтобы добавить класс, нажимаем на элемент правой кнопкой мыши и выбираем из списка «Add CSS Class Name» и далее, справа в настройках указываем класс

2. Указываем в генераторе кода радиус скругления каждого угла

3. Копируем готовый код и вставляем в HTML блок Т123

Примечание! Если на старице присутствует несколько элементов которым нужно скруглить углы с одинаковыми параметрами, то достаточно всего одного кода + назначить каждому элементу одинаковый класс. Если у разных элементов должны быть разные углы, то генерируем несколько кодов с уникальными названиями классов. Например tc-custom-radius, tc-custom-radius2 и т. д.

Скругление углов у Google Maps и Яндекс Карт

Очень простая модификация, которая добавляет скругление углов для блоков с картами T143 (Карта Google или Yandex) и CN401 (Контакты и карта в две колонки).

Посмотрите пример, чтобы понять, как работает модификация.

Выберите нужный вам блок, радиус скругления и просто скопируйте код, представленный ниже и вставьте его в блок T123 на странице под блоком с картами.

Если хотите, чтобы скругление углов применилось для всех карт на сайте, добавьте внутренность кода (то, что между тегами <style> и </style>) в общий CSS в настройках сайта.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *