У Flex block ви можете додавати зображення, розміщувати їх у довільному місці блоку та одне над одним, вирівнювати за різними сторонами блоку (за лівим та верхнім краєм тощо), змінювати розмір і видиму частину зображення (позиціонувати його) тощо — це надає свободу у редагуванні та дозволяє реалізувати безліч креативних ідей.

Зміст:

• Додавання та редагування зображення
• Групове редагування зображень
• Режим заповнення (зміна пропорцій зображення)
• Режим масштабування (збереження пропорцій зображення)

Додавання та редагування зображення

1. Після додавання елементу “Зображення” наведіть на нього та натисніть на "шестреню". У новому вікні натисніть на Завантажити для додавання файлу з власного комп’ютера або на кнопку Галерея для пошуку чи генерації інших зображень:

2. У новому вікні ви можете обрати одне з вже доданих зображень, знайти необхідне стокове зображення у вкладці Безкоштовні фото чи згенерувати власне зображення за допомогою AI Visual:

3. Затисніть клавішу ALT та клікніть на зображення, щоб побачити відстань до краю блоку у пікселях:

4. Щоб переміщувати зображення по простору блоку, затисніть його лівою кнопкою миші та потягніть у необхідний бік. Щойно зображення наблизиться до центру блоку по довжині або ширині, ви побачите відповідні лінії червоного кольору — вони стануть у пригоді, якщо вам необхідно розмістити зображення рівно по центру блоку (за вертикаллю та/або за горизонталлю):

5. Натиснувши на іконку у вигляді трьох крапок, у вас відкриється перелік доступним дій із зображенням:

Групове редагування зображень

1. Ви можете виділити мишкою декілька зображень та переміщувати їх як один елемент:

2. Щоб перевірити відстань у пікселях від одного зображення до іншого, оберіть одне з них, а потім наведіть курсор на інше:

3. Зображення можна також розміщувати один відносно одного за верхнім краєм:

…по нижньому краю:

А також вирівняти центри двох зображень між собою:

Режим заповнення (зміна пропорцій зображення)

За замовчуванням до Флекс блоку зображення додаються з режимом заповнення (Scale to fill) — тобто зображення буде заповнювати ту область (контейнер), який для нього виділений, навіть якщо за такої умови частина зображення буде обрізана.

1. Ви можете редагувати розмір зображення, розтягуючи чи звужуючи його у різні боки:

2. Також є можливість налаштувати позиціювання зображення, тобто те, яка його частина буде видимою, а яка буде обрізатися. Для цього натисніть на кнопку Позиціювання:

…та оберіть частину зображення, яка має відображатися:

3. Натисніть лівою кнопкою миші за межами фото, щоб застосувати зміни.

Детальніше дізнатися про цей режим можна у наступному відео:

4. У режимі заповнення у вас ще є можливість зменшувати та збільшувати масштаб зображення, щоб обрати необхідну його область, котра має бути відображена.

ㅤㅤㅤ1) Для цього натисність на вищезгадану кнопку Позиціювання або двічі клікніть по зображенню.

ㅤㅤㅤ2) Після цього встановить необхідний масштаб зображення:

...та натисніть мишкою за його межами, щоб застосувати зміни.

ㅤㅤㅤ3) У разі необхідності ви матимете можливість обрати для відображення ту область зображення, котра вам необхідна:

Режим масштабування (збереження пропорцій зображення)

Режим масштабування (Scale to fit) дозволяє вам змінювати розміри зображення зі збереженням його пропорцій — це зручно, якщо вам важливо, щоб зображення мало свої оригінальні пропорції і жодна його частина точно не була обрізаною.

1. Щоб активувати цей режим, натисніть на іконку шестерні:

2. Активуйте перемикач Масштабувати:

Ця опція дозволяє змінювати розмір зображення зі збереженням його пропорцій:

Будемо раді допомогти в чаті або на пошті (support@weblium.com) в будь-який час!

Оновлено: 31/01/2024