Як зробити гумову шапку.

Верхня частина сайту, яка ще називається шапкою, зазвичай відображає тематику ресурсу і може містити панель навігації. Якщо шапка сайту має певну ширину, то на екранах користувачів, що мають різний дозвіл, ця частина сайту буде виглядати по-різному. Для того, щоб шапка сайту на будь-якому екрані виглядала однаково, необхідно деякі її ділянки зробити розтягуються або сжимающимися залежно від розмірів екрану. Таку гумову шапку можна зробити, відмовившись від фіксації її ширини в пікселях.
Вам знадобиться
  • - мати власний сайт
Інструкція
1
Щоб зробити гумову шапку , спочатку намалюйте її в фотошопі. Потім відокремте 3 частини картинки: 2 бічних і середину. Ці частини повинні бути шириною приблизно в 10-20 пікселів і висотою в потрібну висоту шапки. Збережіть кожен елемент так, щоб у вас вийшло 3 різних файлу: 1.gif", 2.gif", 3.gif". Залийте ці зображення на сайт.
2
Потім створіть таблицю, в якій будуть міститися елементи верхній частині сайту. Для цього в HTML-коді напишіть:
Таблиця з шириною 100% буде розтягуватися або стискатися залежно від розмірів екрану користувача.
3
Зробіть в таблиці рядок, в комірці якої розмістіть ліву частину шапки сайту 1.gif":
4
Створіть середню частину шапки сайту, що складається з повторюваної картинки 2.gif". Для цього в CSS-коді зробіть такий запис: .header {background-image: url ('images/2.gif"');}
5
Тепер в рядку таблиці створіть ще один осередок і помістіть в неї середній елемент верхній частині сайту, вказавши на його назву header в CSS-коді:

Назва сайту
6
Створивши третю ячейку в рядку таблиці, розташуйте в цьому осередку праву частину шапки сайту 3.gif":

Назва сайту