Добавление тени и рамки к GIF

Эта инструкция поможет вам добавить тень и рамку к GIF-изображениям на страницах документации. Способ работает и для других форматов изображений.

Функция доступна только для онлайн-документации, при экспорте печатных форматов эффекты не сохранятся.

Следуйте этим шагам:

Шаг 1. Откройте CSS-файл проекта

  1. Перейдите в режим Дизайн.
  2. На вкладке Главная откройте раздел Стили.
  3. Нажмите кнопку Открыть файл для редактирования.
    Как открыть свойства изображения

Откроется первый CSS-файл из списка стилей проекта.

Шаг 2. Добавьте CSS-класс и эффекты

Добавьте соответствующий CSS-класс и эффекты.

Для добавления тени используйте следующий код:

CSS
/* Gifs */
.gifShadow {
  box-shadow: 10px 5px 5px gray;
}

Для добавления рамки используйте этот код:

CSS
/* Gifs */
.gifBorder {
  border: solid;
}

Шаг 3. Примените стиль к изображению

  1. Вернитесь на страницу с GIF-изображением.
  2. Кликните по изображению и нажмите Свойства изображения….
    Как добавить свойства изображения
  3. Выберите созданный CSS-класс (например, .gifShadow или .gifBorder).
    Добавить CSS-класс к изображению
  4. Нажмите ОК.

Вот, что у нас получилось:

Так выглядит GIF-изображение с добавленной тенью

Готово! Теперь вы можете добавлять любые CSS-эффекты к изображениям.