Фрейм — це HTML-елементи, що дозволяють розділити вікно веб-браузера на кілька незалежних вікон, у кожне з яких можна завантажити окремий документ HTML. Кожне таке вікно (фрейм) може мати власні смуги прокручування та функціонувати незалежно від інших незалежних вікон або навпаки керувати їх змістом.
Переваги фреймів — у можливості:
- відображати різну інформацію у межах одного вікна;
- відображати інформацію, не включаючи її до кожної сторінки;
- легко і швидко будувати гнучку навігацію сайтом.
Недоліки фреймів:
- головна перевага фреймів (відображення різної інформації в межах одного вікна) одночасно є і недоліком, бо доступна область веб-сторінки істотно зменшується;
- при створенні фрейму правильно вибрати його розмір часто буває складно. У більшості випадків користувач вимушений постійно гортати фрейм за допомогою смуг прокручування;
- при низькій роздільній здатності монітора об'єм видимої інформації істотно зменшується;
- багато пошукових систем і каталоги відмовляються реєструвати сторінки, що використовують фрейми.
Для того щоб створити веб-сторінку з фреймами, потрібно в HTML-документі задати розмітку екрана, тобто розташувати у вікні браузера фрейми, кожному з яких призначити свої документи.
Сторінка з розміткою, як і звичайна, починається з тегу <html> і закінчується тегом </html>. Для поділу екрана на кілька фреймів використовують контейнер <frameset>…</frameset>.
Перший потрібно розташувати після тегу заголовка, але перед тегом <body>. У таких документах інколи зовсім не використовують контейнер <body>…</body>.
Фрейми можна розташовувати поруч по горизонталі або один над одним по вертикалі. У першому випадку використовують атрибут cols, а в другому — атрибут rows.
Для поділу вікна на фрейми через кому записують числа, які визначають розміри фреймів зліва направо або згори донизу.
Для k фреймів потрібно k чисел. Розміри фреймів вимірюють у пікселах або відсотках від розміру екрана.
Якщо потрібно зазначити, що фрейм займає те місце, яке залишилося, використовують символ * замість числа.
Тег frameset
Атрибуты тега frameset:
- Cols - вертикаль
- Rows - горизонталь
У атрибутах cols і rows вказується на скільки частин ділити вікно браузера.
Тег <frameset rows="150, *">, наприклад, задає поділ вікна на два горизонтальні фрейми, один з яких має висоту 150 пікселів, a другий займає те місце, що залишилося.
Тег <frameset cols="20%, 55%, *">, наприклад, задає поділ вікна на три вертикальні фрейми, один з яких займає 20% від ширини екрана, другий — 55%, а третій займає те місце, що залишилося, тобто 25%.
Можна використовувати одночасний і горизонтальний, і вертикальний поділ вікна на фрейми — це роблять за допомогою вкладення контейнерів <frameset>…</frameset> один в один.
Тег frame
Після поділу екрана на вікна для кожного фрейму потрібно задати HTML-документ, який буде відображено в ньому. Для цього використовують тег <frame> з атрибутами, що керують властивостями фреймів:
- src — задає назву файлу, що відображатиметься у фреймі;
- name — задає назву фрейму;
- scrolling — визначає наявність або відсутність смуг прокручування у вікні фрейму (за умовчанням — yes, альтернатива — no);
- noresize — забороняє користувачу змінювати розміри фрейму;
- border — визначає ширину розділювальної смуги між фреймами у пікселах;
- bordercolor — визначає колір розділювальної смуги між фреймами;
- marginheight — визначає відстань у пікселах між верхньою межею фрейму і текстом або графікою;
- marginwidth — визначає відстань у пікселах між боковими межами фрейму і текстом або графікою.
Приклад реалізації фреймової структури сайту
Файл index.html
Файл top.html
Файл menu.html
Файл about-site.html
Файл about-autor.html
Файл content.html
Файл footer.html