Використання заливки кольором та фонової заливки в Adobe Muse

На цій сторінці

Заливка браузера та фонові зображення в Adobe Muse

Заливка фону є важливою складовою дизайну при розробці веб-сайту. Функція "Фонове заливання" в Adobe Muse дозволяє налаштовувати колір фону або встановлювати зображення як фон на веб-сайті. Фонове зображення може містити символіку бренду та інші атрибути продукції та послуги. Фонове заливання теж може відображати корпоративну символіку, повторюючи дизайн або тему кольору сайту вашої організації.

З цієї статті ви дізнаєтеся, як застосувати фонову заливку в Adobe Muse. Доступні такі варіанти:

Заливка браузера кольором фону

Сторінку «Шаблон-А» буде відкрито на окремій вкладці у верхній частині робочого середовища.

Зверніть увагу на індикатор виділення, розташований у верхньому лівому куті панелі керування. Якщо елементи сторінки не виділені, на індикаторі виділення відображається слово «Сторінка». Якщо на сторінці виділено об'єкт (наприклад, зображення), на індикаторі виділення з'являться слова «Фрейм зображення».

Використовуйте індикатор виділення, щоб перевірити вибраний елемент для керування. При виборі будь-якого іншого елемента сторінки можна знову виділити сторінку, натиснувши область сірого кольору за межами сторінки.

Якщо вибрано всю сторінку, можна скористатися меню на панелі керування, щоб змінити колір заливки та параметри обведення.

На панелі керування виберітьЗаливка у браузері. У поліКолір виберіть потрібний колір. Вибрати колір заливки фону можна одним із наступних способів:

  • Виберіть колір на панелі кольорів.
  • Введіть RGB.
  • Введіть шістнадцятковий код кольору вполеHex#.
  • Натисніть та виділіть колір із збережених зразків.

заливки

Щоб застосувати суцільну або градієнтну заливку кольором, на панеліЗаливання у браузері виберітьСуцільна абоГрадієнтна. Використовуйте перемикач для вибору між суцільною та градієнтною заливкою кольором.

Щоб застосувати градієнт, для параметра «Заливка» виберітьГрадієнтна. Виберіть перший і останній колір градієнта зі зразків кольорів.

кольором

Налаштуйте орієнтацію градієнта, вибравши для параметра "Напрямок" значення "По горизонталі" або "По вертикалі".

На панелі керування виберітьЗаливка. Перевірте, чи для кольору заливки сторінки вибрано значенняНі. У меню «Заливка» відображається зразок білого кольору з червоною діагональною лінією.

Заливка фону за допомогою зображення

Часто як тло веб-сайтів використовується зображення. В Adobe Muse можна виконати заливку фону безліччю повторюваних зображень або одним зображенням. Крім того, можна настроїти розташування та прокручування фонового зображення.

Нижче наведено інформацію про те, як використовувати зображення як заливку фону в Adobe Muse.

Відкрийте сторінку-шаблон файлу .muse.

Фонове зображення можна налаштувати для певної сторінки. Щоб відобразити фонове зображення на кожній сторінці проекту, перейдіть на сторінку-шаблон.

На панелі керування виберіть пункт «Заливка в браузері». Перевірте, чи для параметра «Заливка» встановлено значення «Суцільна».

кольором

Якщо для параметра «Заливка» вказати значення «Градієнтна», використовувати зображення як фонове заливання буде неможливо.

Щоб вибрати зображення як заливку фону, натиснітьпосилання «Додати». Перейдіть до потрібного файлу зображення на комп'ютері та виберіть його. Натисніть кнопку «Відкрити», щоб вибрати зображення як фон.

Налаштуйте припасування фонового зображення. Можна вибрати одну з таких опцій:

  • Заповнення : фонове зображення відповідає заданому розміру. Розмір та розташування зображення відповідає заданим параметрам.
  • За розміром : зображення підганяється для розміщення у вказаному місці.
  • Початковий розмір : зображення використовується як заливка фону в початковому розмірі.
  • Мозаїка : зображення повторюється на всій площі фону. Параметр мозаїки дозволяє створювати невеликі зображення, які повторюються у вікні браузера, незалежно від розміру монітора відвідувача.
  • По горизонталі : зображення повторюються по горизонталі.
  • По вертикалі : зображення повторюються по вертикалі.

Щоб вказати розташування фонового зображення, виберіть одне з дев'яти наявних сіток. Наприклад, якщо натиснути центральний квадрат, зображення з'явиться у центрі вікна браузера.

Щоб видалити заливку фону, натисніть піктограму кошика на піктограмі папки.

Натисніть будь-де за межами панелі «Заливка в браузері», щоб закрити її.

Настроювання ширини 100% для елементів сторінки

Елементи, для яких задано ширину 100%, заповнюють вікно браузера по горизонталі незалежно від ширини вікна браузера. Якщо для елемента сторінки встановлено вирівнювання по верхньому та нижньому краях вікна браузера, об'єкт із заливкою суцільним кольором або мозаїкою розшириться, заповнюючи всю доступну область.

Відкрийте сторінку з елементом, для якого потрібно вказати ширину 100%. Виділіть потрібнийелемент сторінки. Наприклад, виділіть прямокутник у нижній частині сторінки, ширина якого дорівнює ширині сторінки, а висота — приблизно 250 пікселів.

Не знімаючи виділення з прямокутника, встановіть значення «0» для параметраШирина обведення. На те, що прямокутник виділено, вказуєіндикатор виділення у верхньому лівому куті. На індикаторі відображається слово «Прямокутник».

На панелі керування виберітьЗаливка. Перевірте, чи для меню «Заливка» вибрано значення «Ні». На це вказує зразок білого кольору із червоною діагональною лінією.

використання

НатиснітьДодати на панеліЗаливка. Перейдіть до потрібного зображення, виділіть його та натиснітьВідкрити.

З розкривного спискуПідгонка виберітьПо горизонталі. При виборі цього параметра зображення буде повторюватися у вигляді мозаїки зліва направо по осі X.

заливки

Перетягніть маніпулятори трансформації прямокутника таким чином, щоб він розмістився в нижній частині видимої області. Змініть ширину, щоб прямокутник перетинав ліву, праву та нижню межі сторінки.

Тимчасово з'явиться червона рамка, що вказує на те, що прямокутник має ширину 100%.

Налаштування непрозорості та прозорості фонових заливок

Крім додавання зображення як фон веб-сайту, Adobe Muse також дозволяє змінювати параметри непрозорості заливки. Можна налаштувати колір заливки сторінки та зробити її частково прозорою. За замовчуванням для сторінки-шаблону Adobe Muse використовує заливку білого кольору. Можна змінити колір заливки сторінки та її прозорість.

Напанелі керування натиснітьЗаливка в браузері, щоб відкрити меню. Щоб вибрати зображення та встановити його як заливкуфону, натиснітьДодати.

Напанелі керування натиснітьЗаливка, щоб відкрити меню «Заливка».

Встановіть для параметраНепрозорість значення 80%. Це означає, що сторінка буде майже повністю непрозора (прозорість складатиме 20%). Крім того, можна продовжити змінювати сторінку та додати кордон або застосовувати додаткові графічні ефекти.

кольором

Заливка фону та ефекти прокручування

В Adobe Muse можна застосувати ефект переміщення під час прокручування до зображень, які використовуються як заливка фону. Інформацію про налаштування властивостей прокручування фонових зображень див. у розділі Застосування ефекту переміщення до фонового зображення.

На пости, що розміщуються в Twitter™ та Facebook, умови Creative Commons не поширюються.