Як розтягнути шапку на сайті.

Сьогодні якісні сайти повинні добре виглядати на екранах з самими різними дозволами. Для цього необхідно, щоб елементи оформлення сторінки масштабувати в широких межах. У першу чергу це відноситься до шапці сайту.
Вам знадобиться
  • - можливість зміни розмітки сторінок ресурсу.
Інструкція
1
Використання відповідного шаблону - універсальне рішення, що дозволяє не тільки розтягувати, а й стискати шапку , а також інші елементи оформлення. Можна використовувати стандартні шаблони, які надаються безкоштовними хостингами, або вільно поширювані в інтернет. Будь шаблон вимагає доопрацювання і адаптації. Бажано поміняти всю графіку, щоб надати унікальності сайту. Ніколи не використовуйте стандартне оформлення шаблону. Залишайте розмітку сторінки - її «скелет», а «м'ясо» - зміст та елементи оформлення замініть на власні. Вдумливе використання шаблонів дозволяє заощадити час розробника, яке може бути витрачено на наповнення сайту інформацією, або розширення можливостей сервісу.
2
Якщо сторінка вже зверстана, можна спробувати розтягнути шапку самостійно. Для цього будуть потрібні базові знання HTML і СSS. Якщо шапка сайту оформлена у вигляді одного графічного файлу, можна спробувати стискати і розтягувати її зображення в залежності від ширини вікна. Цей спосіб добре працює, якщо коефіцієнт масштабування невеликий. Якщо він перевищує ширину зображення на чверть і більше, постраждає якість картинки. Стануть помітні окремі пікселі, що формують зображення.
3
Для того щоб зображення залишалося якісним, але при цьому займало весь відведений для нього простір, необхідно розділити його на окремі частини. Зазвичай це права сторона, ліва і центральна. Бажано, щоб у зображення був однотонний по ширині фон, яким можна було заповнити проміжки, що виникають між частинами шапки. Дві картинки, що формують краю шапки, необхідно закріпити на лівій і правій сторонах контейнера. Центральне зображення укладіть в тег
. Фоновим зображенням шириною в один піксель Замость залишився простір.
4
Ще один простий спосіб полягає в створенні зображення, свідомо більшого, ніж найбільший екран. Зображення встановлюється фоном по центру розділу шапки. Мінусом є великий «вага» зображення, і як наслідок - тривалий час його завантаження. Комбінування зазначених вище способів дозволяє уникнути більшості негативних ефектів.