Сергій Сироїжкін Копірайтер
У минулій статті ми говорили про те, як змінити колір фону на сайті за допомогою атрибутів тега body і CSS-стилів: Фон в HTML. У поточній статті мова піде про використання зображень як фону на сайті, про те як розтягнути фон на всю ширину сторінки і зафіксувати його.
Картинка в якості фону сторінки - HTML
Розглянемо спочатку спосіб завдання фонового зображення на сайті за допомогою атрибута background тега body:
Примітка: Фонове зображення і колір фону рекомендується ставити не за допомогою HTML, а за допомогою CSS. В такому випадку код буде дійсним і більш правильним.
Картинка в якості фону сторінки - CSS
В CSS фоновий колір і фонове зображення можна задати одним властивістю background:
Тут за допомогою властивості background-attachment фіксується фон сторінки, а за допомогою властивості background-repeat встановлюється повторення зображення по горизонталі. Але варто врахувати, що фонове зображення повинне добре "зшивати" по краях.
Якщо ви хочете розтягнути фонове зображення на весь розмір вікна браузера, використовуйте властивість background-size: 100%;
У конструкторі сайтів "Нубекс" для будь-якого сайту можна використовувати велике зображення в якості фону і закріпити його.