Введення в html-фрейми

Фрейми (frame) дозволяють нам відкрити відразу два або більше хтмл-файлу, представте ту "повноцінний сторінку" яку ми зробили з таблиць і картинок, так ось цього можна було досягти і на фреймах, представите що логотип це перший файл, навігація другий і контент третій.

Основний шаблон html-файлу трохи відрізняється від звичайного файлу, в ньому відсутній тег BODY взагалі.

Кажий html-файл в фреймах називається рамка (frame), все рамки вставляються в набір рамок (frameset), але почнемо по порядку.

frameset є тегом контейнером і закриває (кінцевий) тег необхідний.
Цей тег може приймати всього два атрибути:
rows визначає що в frameset горизонтальний висновок фреймів.
cols визначає що в frameset вертикальний висновок фреймів.
Обидва цих атрибута приймають одні значення, які вказують скільки файлів ми підключаємо і їх розміри. Розміри фреймів задаються:
1) У відсотках:

Якщо у вас три фрейми тоді головне щоб в результаті сума всіх фреймів вийшла 100%.
2) Пропорційні в пікселях В процентах звичайно задавати розміри можна, але знову-таки дозвіл екрана у кожного монітора різний і тоді приходять на допомогу пікселі. У нашому прикладі перший фрейм буде 150 пікселів, другий 10 пікселів. а ось цей символ * каже браузеру що третій фрейм займе весь інший простір. Цей символ вводиться клавішами shilt +8.
Є ще ось такий варіант: rows = "150,1 *, 3 *". виходить перший фрейм займе 150 пікселів, а простір, що залишився візьмемо як 100%, значить друга осередок займе 25%, а третя 75%. Це як в школі рівняння, 1х + 3х = 100.

Вкладені фреймів. Фрейми (frameset) можна при необхідності вкладати інші фрейми, наприклад базовий ми розташуємо горизонтально, а вкладений вертикально:

Для того щоб frame довантажити інший html-файл в нього потрібно вставити атрибут SRC (шлях в файлу, як в картинках).

Якщо ми всі знаємо, то давайте попрактікуемся з фреймами. Створимо перший документ logotip.html:

В який вставимо тільки картинку логотип.
Створимо другий документ з навігацією navigatcia.html.
І створимо документ для контенту kontent.html