Поняття фрейма в HTML

1. Створення структури фреймів елемент FRAMESET
2. Атрибути елемента <FRAMESEТ>
3. Атрибут

Вікно браузера може бути розділене на частини, які називаються фреймами, іноді кадрами; можна їх назвати і шибка. В кожну таку частину вікна браузера, тобто фрейм, може бути завантажений окремий HTML документ. Розглянемо приклад вікна браузера з трьома фреймами.

У кожен фрейм в цьому випадку для наочності завантажений простий HTML документ, який повідомляє номер фрейма і назва файлу, що зберігає його вміст. Якщо в фрейм буде завантажений реальний документ, який не поміщається повністю в ньому, то у фрейми (увага, не у всього вікна!) З'являться вертикальна і / або горизонтальна смуги прокрутки в залежності від того, по горизонталі та / або по вертикалі не поміщається вміст документа.
Наприклад, дизайн і структура вашого сайту такі, що є однакові елементи, що повторюються на кожній сторінці сайту: назва, навігаційне меню, адреса в кінці сторінки або якісь інші подібні елементи. Змінюється тільки зміст розділів. Тоді сторінки можна розбити на частини таким чином, щоб незмінні частини були поміщені в окремі фрейми, а ще один фрейм виділити для того, щоб в нього завантажувалося вміст потрібного розділу після клацання на відповідне посилання, наприклад, з меню.
Це дає економію в швидкості завантаження, так як однакові частини сторінок сайту повторно не завантажуються, а просто весь час відображаються в відведених їм фреймах.

Створення структури фреймів елемент FRAMESET

Структура розбиття вікна зберігається в окремому HTML документі, він і називається документом з фреймами. Структура фреймів формується за допомогою спеціального елемента FRAMESET. Звичайний документ має один розділ HEAD і один розділ BODY, тоді як в документі з фреймами розділ BODY замінюється описом структури фреймів, Тобто розділом FRAMESET.
В розділ FRAMESET може бути доданий елемент NOFRAME з альтернативним змістом для відображення в браузерах, що не підтримують фрейми, або в браузерах з відключеною підтримкою фреймів. Такі браузери просто не зрозуміють структури FRAMESET і NOFRAME, а відобразять поміщений всередині них текст.

Зверніть увагу, що розділ BODY в документі відсутня повністю, а елемент NOFRAMES міститься всередині розділу FRAMESET.
Сама структура фреймів формується розподілом вікна браузера на частини - рядки і колонки; В якійсь мірі це схоже не створення таблиць. Для цього у елемента FRAMESET існують атрибути cols і rows, що задають розподіл на колонки і рядки відповідно.
Одиниці виміру, в яких можна задавати розміри фреймів, це, як правило, пікселі і відсотки. Є ще можливість задавати розмір в новій поки для нас одиниці виміру, яку умовно можна назвати «частина» вікна. Значення атрибутів cols і rows задаються перерахуванням розмірів відповідних областей через кому. Можна комбінувати різні способи завдання. Розглянемо кілька прикладів, виходячи з припущення, що розмір вікна браузера 800х600 пікселів.

Такий код поділить вікно по горизонталі на два однакових по висоті фрейма (рядки). Якщо задати атрибут cols = "50%, 50%», то отримаємо дві однакові по ширині колонки.

При такому коді отримаємо три колонки фреймів: ліва шириною 120 пікселів, середня шириною 400 пікселів, а на третю колонку відводиться все, що залишиться від перших двох колонок, в атрибуті це значення позначається символом зірочки «*».

Такий код створить дві колонки фреймів. Ширина першої приймається за одиницю (це позначається як 1 * або просто *), ширина другий в чотири рази більше. Таким чином, ширина першої буде 20%, а ширина другої 80% від загальної ширини вікна браузера.

У наведеному міру комбінуються всі три способи завдання розмірів. Ширина першої колонки буде дорівнює 100 пікселів, для другої відводиться 40% залишилася ширини (800 - 100 = 700), і на третю залишається все, що не зайняте першої і другої колонками.
Розділ FRAMESET може містити вкладені розділи FRAMESET, що дозволяє створити досить складну структуру фреймів. Припустимо, нам треба розділити вікно на 4 фрейму таким чином:

Спочатку необхідно організувати 2 колонки таким чином:

Потім другу колонку поділити на три рядки таким чином:

Окремий кадр, точніше його опис, задається елементом FRAME і його атрибутами: докладніше про нього трохи пізніше. Повернемося до вкладених елементів FRAMESET. Розглянемо приклад коду, що створює таку структуру фреймів:

Яким чином розбивається вікно на фрейми, начебто розібралися. При створенні фреймів можна зробити так, щоб кордони між фреймами видно не було. Як ви, напевно, вже здогадалися, робиться це за допомогою атрибуту border його значення повинно дорівнювати нулю. Але справа в тому, що для фреймів цей атрибут не сприймається браузером Internet Explorer, зате підтримується браузером Netscape Navigator. Для Internet Explorer межа між фреймами задається атрибутом frameborder, який не підтримується браузером Netscape Navigator. Виходить, що необхідно ставити однакові значення для обох атрибутів, щоб обидва браузера сприйняли HTML код однаково і товщина кордонів між фреймами була однаковою.
Товщину кордонів або, по-іншому, відстань між фреймами також можна регулювати атрибутом framespacing, значення якого задається в пікселях. Всі атрибути елемента FRAMESET наведені в таблиці.

Атрибути елемента <FRAMESEТ>

Атрибут

опис

приклад

а) у відсотках від висоти робочої області вікна браузера наприклад: "30%, 30%, 40%";

б) у вигляді знака «*» (зірочка), що говорить про те, що фрейм займає весь вільний простір вікна браузера, незайняте іншими фреймами з явно вказаними розмірами наприклад, зірочка в запису "25%, 25%, *" рівносильна 50%;

в) в пікселях наприклад: "75, *".

Всі три способи можна поєднувати.

Тепер повернемося до елементу FRAME, який описує окремий фрейм всередині всієї структури. Обов'язковий параметр для нього - атрибут src, який задає URL HTML - документа або зображення для відображення в цьому фреймі. Також краще задати кадру ім'я за допомогою атрибута name. Це дозволить використовувати дане ім'я в якості значення атрибута target елементу А і управляти тим, в який фрейм повинна завантажуватися посилання. Імена фреймів не можуть починатися з цифр, як початкові символів дозволено лише літери латинської абетки (az, AZ).

Коли в структурі фреймів не задана рамка між фреймами, їх вміст може занадто щільно примикати один до одного, що буде не дуже красиво виглядати. Якщо хочете розсунути вміст фреймів і при цьому все-таки не включати відображення кордонів між ними, то це можна зробити, поставивши всередині фреймів відступи. Розмір цих відступів задається в пікселях і попарно: для відступів зверху і знизу атрибутом marginheight,
а для відступів праворуч і ліворуч атрибутом marginwidth. Тоді відстань між вмістом сусідніх фреймів дорівнюватиме сумі відповідних відступів цих фреймів.

Чи повинна відображатися рамка навколо окремою фрейма, визначається його атрибутом frameborder. Значення yes (або 1) говорить про те, що рамка повинна бути, значення no (або 0) вказує, що рамки бути не повинно.
Користувач може змінювати розмір фреймів, створений HTML документом. Для цього досить підвести курсор миші до кордону фреймів (неважливо, видно ці кордони чи ні) і стандартним для операційної системи способом змінити розмір вікна.
У Windows курсор миші набуде вигляду двобічної чорної стрілки. Натиснувши ліву кнопку миші, можна пересунути межу вікна. Аналогічно можна змінити і розмір фрейму, оскільки фрейм це теж вікно. Якщо ви розрахували розміри своїх фреймів і не хочете, щоб користувач змінював їх, задайте атрибут noresize. В результаті зміна розмірів буде заборонено.
Як ми вже говорили раніше, смуги прокрутки у фрейму з'являються в тому випадку, якщо його вміст в заданих його межах повністю не поміщається. Наявність смуг прокрутки регулюється атрибутом scrolling. Допустимі три значення yes, no і auto.
Значення auto відповідає автоматичної появи смуг прокрутки в тих випадках, коли це дійсно необхідно. Якщо вміст видно і так, смуг прокрутки немає, якщо частина вмісту не поміщається з'являється потрібна смуга прокрутки.
Значення yes включає обидві смуги прокрутки незалежно від того, потрібні вони чи ні. Іноді це може виглядати не дуже красиво.
Значення no забороняє показувати смуги прокрутки зовсім. Будьте обережні з цим значенням, оскільки при його вказівці можете позбавити користувача можливості побачити весь вміст фрейма, Коли воно не поміщається в ньому повністю. Всі атрибути елемента FRAME наведені в таблиці.

Атрибути елемента <FRAME>

Атрибут

опис

приклад

Читайте також: