> For the complete documentation index, see [llms.txt](https://wiki.reezonly.ru/space/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.reezonly.ru/space/obuchenie/produkty/vkladka-soderzhanie-produkta-kursa/kak-rabotayut-instrumenty-v-konstruktore-kontenta/rabota-s-instrumentom-izobrazhenie.md).

# Работа с инструментом Изображение

*Время чтения: 5 минут*

{% hint style="info" %}
🎨 Изображение - важный инструмент, который позволяет использовать изображения в ваших уроках. В этой статье мы разберем функционал инструмента.
{% endhint %}

## Как работает инструмент Изображение <a href="#h_b11d8cd694" id="h_b11d8cd694"></a>

Инструмент Изображение позволяет загружать картинки формата jpg, png & bmp на страницу урока.

<figure><img src="https://291055316-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FP3Ys5RYQvMMCdr8qMKQR%2Fuploads%2Fogpft401kzIUhuLqlv0o%2F%D0%98%D0%B7%D0%BE%D0%B1%D1%80%D0%B0%D0%B6%D0%B5%D0%BD%D0%B8%D0%B5.gif?alt=media&amp;token=d76dc01d-fc28-4d12-b7a1-3a6c98e65cc9" alt="" width="563"><figcaption><p>№1. Применение инструмента Изображение</p></figcaption></figure>

1. Перетяните инструмент на страницу урока
2. Загрузите необходимое вам изображение с вашего компьютера

## Дополнительные возможности инструмента Изображение <a href="#h_55d640c1be" id="h_55d640c1be"></a>

Как и многих других инструментов, у **Изображения** есть набор параметров, расширяющих использование инструмента.

<figure><img src="https://291055316-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FP3Ys5RYQvMMCdr8qMKQR%2Fuploads%2FAZBM1bwWtdxw9w7l3oc9%2F%D0%A1%D0%BD%D0%B8%D0%BC%D0%BE%D0%BA%20%D1%8D%D0%BA%D1%80%D0%B0%D0%BD%D0%B0%202025-08-06%20%D0%B2%2017.23.21.png?alt=media&amp;token=14c9b6bc-d965-435c-b4e2-67cfdf4c1b1a" alt=""><figcaption><p>№2. Параметры инструмента Изображение</p></figcaption></figure>

1. **Отображение на устройствах.** Эта настройка позволяет настроить отображение блока на мобильных и десктопных устройствах.
2. **Сетка**. Эта настройка позволяет создать коллаж из изображений на странице урока.&#x20;
3. **Вставка изображения.** С помощью этой настройки вы можете указать соотношение сторон у вставляемого изображения.&#x20;
4. **Масштаб.** С помощью масштаба можно изменять размер изображения на странице.&#x20;
5. **Выравнивание отступов.** Эта настройка выравнивает края изображения.&#x20;

{% hint style="warning" %}
❗️Вы можете загружать изображения весом до 5 МБ.
{% endhint %}

### Настройка сетки <a href="#h_60aa717f14" id="h_60aa717f14"></a>

<figure><img src="https://291055316-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FP3Ys5RYQvMMCdr8qMKQR%2Fuploads%2FRo3FHboxGHQduzVZK7AY%2F%D1%81%D0%B5%D1%82%D0%BA%D0%B0.gif?alt=media&amp;token=b59ac763-6b4a-4ded-925e-67fd5f79e46b" alt=""><figcaption><p>№3. Настройка сетки изображений</p></figcaption></figure>

1. Кликните на инструмент на странице урока
2. В параметре **Сетка** выберите нужное количество изображений в инструменте: 1,2 или 3
3. Вставьте необходимо изображение

{% hint style="success" %}
☘️ Если вам необходимо удалить изображение из инструмента, кликните на троеточие в правом верхнем углу изображения и нажмите **Удалить**
{% endhint %}

### Настройка соотношения <a href="#h_68203b5c48" id="h_68203b5c48"></a>

Настройка **Вставка изображения** позволяет настроить соотношение сторон у вставляемых картинок в нужном вам виде

<figure><img src="https://291055316-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FP3Ys5RYQvMMCdr8qMKQR%2Fuploads%2FmF7U4Kdw5fhQGBhLbl7t%2F1-.gif?alt=media&amp;token=4dfdb541-8d3d-4556-8e1d-4bc7447ac585" alt=""><figcaption><p>№4. Настройка соотношения сторон</p></figcaption></figure>

1. Кликните на инструмент на странице урока
2. В параметре Вставка изображения выберите нужное соотношение сторон

{% hint style="warning" %}
✴️ Применяемые настройки действуют на все вставляемые изображения
{% endhint %}

{% hint style="info" %}
🕷️ В этой статье мы рассказали вам об инструменте Изображение, о работе других инструментов вы можете узнать в других статьях раздела. Если у вас возникли дополнительные вопросы, напишите нам в службу поддержки. Мы всегда рады помочь:)
{% endhint %}
