Фон сайту 70 фонових зображень і опис як вставити фон в html

Останній тренд в дизайнах сайтів - використання великих фонових зображень.

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

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

Так, ви, напевно, і самі звертали увагу на те, як сучасно і стильно виглядають сайти з великими фоновими картинками!

Якщо ваш сайт працює на wordpress, фон для нього встановити дуже просто: в адмінці сайту перейдіть за посиланням у лівому меню на сторінку "Зовнішній вигляд (Дизайн) - Фон".

Якщо такого пункту немає, значить, ваша тема не підтримує функцію завантаження фону. Тоді її потрібно додати.

Відкрийте файл functions.php і вставте в самий низ файлу наступний код:

На сторінці налаштування фону сайту, виберіть пункт "Фонове зображення" і завантажте його.
Виберіть з наступного налаштування фону:

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

Як вставити фон в html?

Тепер потрібно вставити в файл стилів style.css наступний код, який додасть адаптивності нашому фону:

Якщо ваш сайт працює не на wordpress, а на іншому двигуні або взагалі без нього картинку для фону сайту можна додати так:

Трохи про параметри фону (background):

Вони вказують браузеру, що зображення:

no-repeat - не повторюється
center center - позиціонується по центру
fixed - зафіксовано
#eeeeee - має сірий колір фону

background size cover:

Властивість CSS3 background-size масштабує фонове зображення зі збереженням пропорцій.

І останнє: використання префіксів -ms-filter і filter дозволить домогтися підтримки старих версій браузерів.

Ось, як просто на сайті зробити фон 🙂

Пропоную, також, скачати архів фонових зображень з візерунком Боке шириною 1920px.

↓ Як завжди, архів доступний для завантаження моїм передплатникам

Вже завантажили 200 раз (а)

відкрити ↓

Частина зображень я знайшла на безкоштовних фотостоках і змінила їх розмір, а іншу частину зробила самостійно.
Всі зображення безкоштовні для особистого та комерційного використання.

Будь ласка, не викладайте їх на інших сайтах!

Якщо хочете поділитися ними з вашими читачами, просто дайте посилання на цей пост.

Ось кілька прикладів того, що входить в архів:

Фон сайту 70 фонових зображень і опис як вставити фон в html

Всього в архіві 70 зображень.

Підписуйтесь на розсилку, щоб не пропустити цю подію 🙂

Не забудьте проголосувати за цей пост, якщо вам сподобалися мої фони!

Спробуйте відключити плагіни і перевірити.
Схоже, що завантаження фону блокує якийсь із полігонів.

Вітаю! Дуже красиві зображення для фону. Я скачала, встановила.
Моя тема підтримує функцію завантаження фону, але, на сайті фон чомусь не відображається.
Яка може бути причина?

Можливо, якийсь із полігонів гальмує завантаження фону.

Спробуйте відключити плагіни і перевірте.

Привіт, Люда! Дякую за чудові фони.Оні дійсно дуже красиві і насичені.

Вітання!
Я Ксана
(В миру Людмила) - веб дизайнер і розробник сайтів.
На цьому блозі я пишу про Wordpress - про створення, підтримки і просування сайтів на цьому движку, про плагіни і темах для нього, про дизайн та верстку.

Розповідаю, також, про свій досвід з видобутку грошей в мережі.

Сподіваюся, це все вам буде цікаво.