Урок 6. Фреймы
Иногда у разработчика возникает необходимость объединить несколько документов HTML в одном окне браузера. Для этого используется страница со специальной разметкой, описывающей, каким именно образом располагать документы в окне. Контейнер для каждого из объединяемых таким образом документов называется ФРЕЙМОМ (англ. frame — рамка, оправа).
Описание фреймов
Структура документа, содержащего описание фреймов, отличается от общепринятой. В ней отсутствует контейнер <BODY>, вместо которого используется другой контейнер, структуру которого мы сейчас рассмотрим: <FRAMESET>.
Гипертекстовая разметка в этом случае строится следующим образом:
<HTML>
<HEAD>
...
</HEAD>
<FRAMESET rows="Высота_строки" cols="Ширина_колонки">
<FRAME src="имя_файла_1" name="имя_фрейма_1">
<FRAME src="имя_файла_2" name="имя_фрейма_2">
<FRAME src="имя_файла_3" name="имя_фрейма_3">
<NOFRAME>
<BODY>
...
</BODY>
</NOFRAME>
</FRAMESET>
</HTML>
Теперь разберёмся, что это значит.
Контейнер <FRAMESET>
Этот контейнер содержит описание количества, размеров и взаимного расположения фреймов, каждый из которых описывается отдельным тегом <FRAME>. Параметры cols и rows определяют размеры фреймов и задаются в виде списка значений, разделённых запятой. Например, если в приведённом выше случае мы захотим расположить три фрейма один под другим в виде строк таблицы равной высоты, нужно написать следующее: <FRAMESET rows="33%,33%,33%">, параметр cols в этом случае отсутствует. То же самое для трёх столбцов одинаковой ширины: <FRAMESET cols="33%,33%,33%">, а пропускается уже параметр rows. Если вместо значения ширины или высоты фрейма указать * (звёздочку), этот фрейм займёт всю оставшуюся часть окна. Если вы задаёте размер какого-то фрейма в абсолютных единицах (пикселах), использовать такой способ определения размеров других фреймов просто необходимо. Например: <FRAMESET cols="25%,120,*">. Можно написать так: <FRAMESET rows="2*,*,3*">. В этом случае каждый из трёх фреймов-строк будет занимать соответственно 1/3, 1/6 и 1/2 высоты экрана браузера.
Существуют и другие параметры контейнера <FRAMESET>: frameborder отвечает за наличие у фреймов трёхмерной рамки, если его значение не равно нулю, а framespacing определяет дополнительное расстояние между фреймами в пикселах.
Тег <FRAME>
Этот тег имеет два основных параметра: name — имя фрейма, использующееся для дальнейших ссылок на него, и src, в котором содержится имя HTML-файла, помещаемого во фрейм. Есть и другие параметры: marginheight определяет размер отступа по вертикали от границ фрейма в пикселах; marginwidth задаёт то же самое, но по горизонтали; noresize (если он указан) запрещает пользователю изменять размеры фрейма, передвигая его границы мышью. Параметр scrolling определяет, нужно ли создавать полосы прокрутки для просмотра содержимого, если оно не помещается в пределы фрейма: при scrolling="NO" полосы прокрутки не будут создаваться ни при каких условиях, значение YES определяет, что они будут присутствовать обязательно, а при scrolling="AUTO" полосы прокрутки будут появляться только при необходимости.
Если вы задумали более сложную структуру, нежели набор строк или колонок, используйте вместо одного из фреймов новый контейнер <FRAMESET>, размечая его так, как это необходимо, дополнительный контейнер <NOFRAMES> при этом не нужен. Например, один из стандартных вариантов разбиения на фреймы — верхняя узкая горизонтальная полоса-фрейм (заголовок), под ней узкая колонка-фрейм слева (панель навигации) и широкая колонка фрейм справа (основной фрейм, куда загружаются разные страницы при работе с панелью навигации), может записываться так:
<HTML>
<HEAD>
...
</HEAD>
<FRAMESET rows="20%,*">
<FRAME src="header.htm" name="head">
<FRAMESET cols="20%,*">
<FRAME src="navbar.htm" name="navigation">
<FRAME src="body.htm" name="mainframe">
</FRAMESET>
<NOFRAME>
<BODY>
...
</BODY>
</NOFRAME>
</FRAMESET>
</HTML>
Попробуйте поиграть со структурой фреймов сами: создайте несколько пустых HTML-файлов с различными контрастными цветами фона и комбинируйте их, меняя главный файл с контейнером <FRAMESET>, пока не надоест. Или — пока не прояснится всё, что вы хотели понять.
Контейнер <NOFRAME>
Этот контейнер нужен только браузерам-старичкам, не понимающим фреймов. До сих пор правилом хорошего тона считается написать здесь несколько слов: так мол и так, уважаемый посетитель, фреймов ваш браузер не понимает, будьте любезны вон, и без новой версии вас здесь не ждут.
Фреймы бывают разные
Существует ещё одна разновидность фреймов, которую, к сожалению, понимает только Internet Explorer: фреймы внутренние, записываемые с помощью контейнера <IFRAME>. Иногда бывает очень удобно иметь возможность включить произвольный HTML-файл в любое место страницы.
Пишется этот контейнер так:
<IFRAME name="имя_фрейма" src="имя_файла"
width="ширина_фрейма" height="высота_фрейма">
...
</IFRAME>
У контейнера есть масса дополнительных параметров, но я думаю, что вы сами найдёте их в спецификации HTML, если будет необходимость.
Если браузер понимает <IFRAME>, весь код, расположенный внутри контейнера, игнорируется, и в фрейм выводится содержимое файла, описанного в src. Если не понимает — этот код отобразится на странице так, как будто непонятного тега не существует в природе.
Кстати, если я не ошибаюсь, Netscape версии 6, несмотря на все свои отвратительные свойства, стал понимать <IFRAME>. Сам же навигатор поддерживает контейнер <ILAYER>, о котором мы говорить не будем хотя бы потому, что он незнаком Internet Explorer.
Применение фреймов
Сколько копий сломано при обсуждении этой темы! Кто-то считает фреймы проявлением мирового зла, кто-то относится к ним достаточно равнодушно, а кто-то использует их по поводу и без повода.
Я считаю, что фреймы стоит использовать лишь тогда, когда без них действительно трудно обойтись. Основным условием приемлемости дизайнерского решения было и остаётся удобство пользования сайтом, и если фреймы «не мешают» — почему бы и нет? Тем не менее, необходимо помнить, что фреймы затрудняют индексацию сайта поисковыми машинами, и, кроме того, достаточно трудно поставить ссылку на конкретный документ, спрятанный во фреймсете, т. к. его URL нигде не показан явно, а при принудительном использовании прямой ссылки после переходе на страницу практически невозможно будет воспользоваться оригинальной навигацией по сайту.
Урок 5. Формы | Урок 7. Слои
наверх
|  |
|
