Вы можете добавить закругленные углы для фона колонок или для границы, или для фотографии. Приведенное в примере CSS правило относится к тегу <img>, поэтому фотографии могут быть размещены в любом модуле, если они выводятся тегом <img>.

Совет: Вы можете добавить другие эффекты для фотографий, например, их вывод в виде круга, в настройках модуля Фото. Для этого нужно изменить настройки обрезки фото на вкладке Общие в настройках модуля Фото.

Чтобы добавить скругленные углы к фону колонки или фотографии:

  1. Откройте настройки колонки или модуля Фото и перейдите на вкладку Расширенные. Если Вы задаете эту настройку для колонки, убедитесь, что Вы назначили границу или цвет фона на вкладке «Стиль».
  2. Прокрутите настройки до блока CSS selectors и задайте ему название в поле Class. Это лучший способ добавить свой префикс к отдельному классу, который используется в шаблонах и модулях. В этом примере, мы зададим классу имя ss-rounded-corners. Сохраните настройки модуля или колонки и выполняйте эти действия каждый раз, когда Вам потребуется сделать закругленные углы.
  3. Добавьте одно или оба CSS правила, указанных после п.5, в зависимости от того, что вы хотите закруглить. Существует несколько мест, где Вы можете разместить CSS код.
  4. Замените класс элемента на свой собственный, и при необходимости укажите радиус скругления в пикселях.
  5. Нажмите Сохранить.

Фон колонки:

.ss-rounded-corners > .fl-col-content {
border-radius: 10px;
}

Фото:

.ss-rounded-corners img {
border-radius: 5px;
}

Примеры

У фотографии слева задан класс ss-rounded-corners:

фото

А вот пример, когда этот же класс задан для строки (т.е. он автоматически применяется для всех фотографий, размещенных в этой строке:

ряд