Лекция: Создание Web-страниц с фреймами
Итак, как же создать Web-страницу с фреймами? Сначала необходимо продумать разбиение экрана на области. Вторым этапом является подготовка HTML-файлов для каждой области. Они создаются по тем же правилам, что и другие гипертекстовые документы. Нужно только учитывать размер области, в которой будет демонстрироваться каждый из них.
2.8.2.1. Элемент <FRAMESET>
Фреймы определяются в структуре <FRAMESET>, которая используется для страниц, содержащих фреймы, вместо раздела <BODY> обычного документа. Web-страницы составленные из фреймов, не могут содержать раздел <BODY> в своём HTML-коде. В свою очередь, страницы с разделом <BODY> не могут использовать фреймы.
Контейнер из тегов <FRAMESET> и </FRAMESET> обрамляет каждый блок определений фрейма. Внутри контейнера <FRAMESET> могут содержаться только теги <FRAME> и вложенные тэги <FRAMESET> .
Тэг <FRAMESET> имеет два параметра: rows и cols. Горизонтальное деление экрана задаётся при помощи атрибута rows, а вертикальное — при помощи атрибута cols. Значение атрибута могут быть выражены в пикселах или процентах. Кроме того используется симвод *, для обозначения оставшейся части экрана.
Приведём несколько примеров:
| cols= 50%, 50% | деление области просмотра по вертикали пополам (принцип программы Norton Commander); |
| rows=150, 30%, * | для верхней горизонтальной области отведенно 150 пикселов, для средней — 30% доступного пространства, а для нижней всё что остаётся; |
| cols=*, 4* | стиль для любителей головоломок, правая вертикальная область в четыре раза шире левой; эту формулу можно записать так: cols=20%, 80% |
2.8.2.2. Элемент <FRAME>
Элемент разметки <FRAME> определяет одиночный фрейм. Он должен располагаться внутри пары тегов <FRAMESET> и </FRAMESET>. Этот контейнер не имеет завершающего тега. Всё определение одиночного фрейма выполняется одной строчкой HTML-кода.
Тег <FRAME> имеет шесть атрибутов: SRC, NAME, MARGINWIDTH, MARGINHEIGHT, SCROLLING И NORESIZE.
На практике в теге <FRAME> редко используются одновременно все атрибуты. Наиболее важный атрибут — SRC (сокращение от слова source). Значение этого атрибута определяет URL-адрес документа, который будет загружён изначально в данный фрейм. Обычно в качестве такого адреса записывается имя HTML-файла, расположенного в том же самом каталоге, что и основной документ. Тогда строка определения фрейма будет выглядеть, например, так:
<FRAME src=«sample.htm»>
Разумеется, в качестве значения SRC может быть задан любой допустимый URL-адрес.
Атрибут NAME определяет имя фрейма, которое может использоваться для ссылки к данному фрейму. Обычно ссылка задаётся из другого фрейма, располагающегося на той же самой странице. Например:
<FRAME src=«sample.htm» name=«frame_1»>
Такая запись создаёт фрейм с именем «frame_1», на который может быть выполнена ссылка. Например:
<A href=«other.htm» target=«frame_1»> Кликните здесь для загрузки документа other.htm во фрейм с именем frame_1 </a>
Обратите внимание на атрибут TARGET, который ссылается на имя фрейма. Если для фрейма не задано имя, то будет создан фрейм без имени, и не будет возможности использовать ссылки на него из другого фрейма. Имена фреймов должны начинаться с алфавитно-цифрового символа.
Атрибуты MARGINWIDTH и MARGINHEIGHT дают возможность устанавливать ширину полей фрейма. Например:
<FRAME src=«sample.htm» marginwidth=«5» marginheight=«7»>
Данный фрейм имеет поля сверху и снизу по 5 пикселей, а слева и справа по 7 пикселей. Не забудьте, что здесь идёт речь о полях, а не о рамках. Параметры MARGINWIDTH и MARGINHEIGHT определяют пространство внутри фрейма, в пределах которого не будет располагаться никакая информация. Минимально допустимое значение этих параметров равно единице.
Для фреймов будут автоматически создаваться и отображаться полосы прокрутки, если содержимое фрейма не помещается полностью в отведённом пространстве. Иногда это нарушает дизайн страницы, поэтому было бы удобно иметь возможность управлять отображением полос прокрутки. Для этих целей используется атрибут SCROLLING. Форма записи:
<FRAME src=«sample.htm» scrolling=«yes|no|auto»>
Атрибут SCROLLING может принимать три значения: yes, no или auto. Значение auto действует также, как и в случае отсутствия атрибута. Значение yes вызывает появление полос прокрутки вне зависимости от необходимости этого, а no — запрещает их появление.
Обычно пользователь может изменять размер фреймов при просмотре страницы. Если установить курсор мыши на рамки фрейма, то курсор примет форму, указывающую на возможность изменения размеров, и позволит выполнить перемещение рамки в нужное место. Это иногда нарушает структуру красиво спроектированных фреймов. Для предотвращения возможности изменения пользователем размера фреймов следует воспользоваться параметром noresize. Этот параметр не требует никаких значений. Естественно, когда задан параметр noresize для одного из фреймов, то размер любого из смежных фреймов также не сможет быть изменён.
2.8.2.3. Элемент <NOFRAMES>
Этот элемент используется, чтобы предусмотреть ситуацию, когда браузер не поддерживает фреймы. В этом случае нужно вывести на экран предупреждающее сообщение или адресовать клиента к другой странице. Фрагмент кода может быть записан следующим образом:
<NOFRAMES>
<P> Для просмотра этой страницы необходим, браузер
поддерживающий фреймы </p>
Вы можете просмотреть
<A href=«без_фреймов.htm»> упрощенную версию </a> страницы
</NOFRAMES>
Разумеется, браузеры поддерживающие фреймы не станут воспроизводить этот код.
Пример страницы с фреймами приведен на рис. 8.1. Обратите внимание на логику вложения фреймовой структуры, состоящей из двух вертикальных фреймов, внутрь среднего фрейма фреймовой структуры, состоящей из трех горизонтальных фреймов.
Рис. 2.41. Пример страницы с фреймами
Глава 3. Основы использования CSS – каскадных таблиц стилей