.:Самоучитель HTML:.
Фреймы
На главную страницу.

Урок1 - Создание шаблона HTML-документа.
Урок2 - Работа с текстом.
Урок3 - Списки и таблицы
Урок4 - Фреймы.
Урок5 - Ссылки в документах HTML.
Урок6 - Графика и звук в документах HTML.
Урок7 - Работа с формами.
Цвета-HTML

  • Что такое фреймы.

    Фреймы (Frames-рамки, кадры) - множественные скроллируемые окна, позволяющие выводить в одном окне браузера, несколько страниц одновременно. Использовани фреймов позволяет получить интересные интерфейсные решения оформления страниц.

  • Как создать документ, использующий фреймы?.

    Сначала нужно создать загрузочный файл, который обычно является главной страничкой сервера и имеет имя index.htm или index.html. В этом файле задаются размеры, количество и атрибуты фреймов. Затем уже будем создавать файлы для каждого из фреймов.

    Фреймы задаются тэгом <FRAMESET></FRAMESET>

    Атрибуты тэга <FRAMESET>:
    rows="разделенный запятыми список пикселов, процентов и относительных длин". Расположение горизонтальных фреймов. По умолчанию равен 100%, что означает одну строку.
    cols="разделенный запятыми список пикселов, процентов и относительных длин". Расположение вертикальных фреймов. По умолчанию равен 100%, что означает один столбец.

    Пример:
    Текст программы:
    <FRAMESET cols="1*,200,3*" >
    </FRAMESET>
    Здесь страница браузера разбивается на три столбца, причем, сначала браузер выделит 200 пикселей для среднего столбца, а затем распределит оставшееся пространство следующим образом:
    Если принять ширину оставшегося пространства за три четыре части (1*+3*=4*), то левый фрейм получит одну (1*) часть а правый фрейм оставшиеся три (3*) части.
    Результат выполнения:
    Страничка разобьется приблизительно так:
    1* 200 пикселей 3*

    Текст программы:
    <FRAMESETrows="30%,70%" cols="33%,37%,*" >
    </FRAMESET>
    В этом случае страница разбивается на две строки, высотой 30% и 70% от всей высоты окна браузера, и три столбца, левый будет задан с шириной 33% от ширины экрана браузера, средний - 37%, а правый получит все что осталось т.е. 100%-(33%+37%)=30%
    Результат выполнения:
    Страничка разобьется приблизительно так:
         
         

    Более сложная структура фреймов создается с помощью вложения набора фреймов друг в друга.

    Допустим, нужно создать следующую структуру сайта:
    Название странички
    Главное меню Здесь будем отображать информацию, выбранную в главном меню
    copyright

    Здесь мы видим три строки, причем средняя имеет два столбца.
    Сначала задаем строки. Верхняя и нижняя будут иметь высоту по 5%, а средняя то что останется.
    <FRAMESET rows="5%,*,5%" >
    Затем задаем столбцы. Левый будет 30% от ширины браузера, а правый, соответственно, 70%.
    <FRAMESET cols="30%,70%" >
    </FRAMESET>
    </FRAMESET>

    Теперь осталось задать сами фреймы. Фреймы определяются тэгом <FRAME></FRAME>.

    Атрибуты тэга <FRAME>:
    src="URL" Описывает URL документа, который будет отображен внутри ланного фрэйма. Если он отсутствует, то будет отображен пустой фрэйм.
    name="frame_name" Имя фрейма, которое должно обязательно начинаться с символа. Содержимое поименованных фрэймов может быть задействовано из других документов при помощи специального атрибута TARGET, описываемого ниже.
    marginwidth="value" Ширина боковых разделительных полос между фреймами в пикселях.
    marginheight="value" Ширина верхних и нижних разделительных полос между фреймами в пикселях.
    scrolling="yes", "no", "auto" Наличие полос прокрутки у фреймов где:
    • yes - полосы прокрутки присутствуют.
    • no - полосы прокрутки отсутствуют.
    • auto - полосы прокрутки присутствуют только при их необходимости (по умолчанию).
    noresize Отмена возможности изменения размеров фреймов. Если у одного фрэйма установлен атрибут noresize, то у соседних фрэймов тоже не может быть изменен размер со стороны данного.

    Исходя из всего этого допишем программу:
    <FRAMESET rows="5%,*,5%" >
    Задаем параметры верхнего фрейма, который будет фиксированной ширины, без полос прокрутки
    <FRAME src="top.htm" name="top_page" scrolling="no" noresize>
    <FRAMESET cols="30%,70%" >
    Задаем параметры левого фрейма, фиксированной ширины, с возможностью вывода полос прокрутки
    <FRAME src="main_mnu.htm" name="main_mnu" scrolling="auto" noresize>
    Задаем параметры правого фрейма, фиксированной ширины, с возможностью вывода полос прокрутки
    <FRAME src="content.htm" name="content" scrolling="auto" noresize>
    </FRAMESET>
    И наконец, задаем параметры нижнего фрейма, фиксированной ширины, без полос прокрутки.
    <FRAME src="bottom.htm" name="bottom_page" scrolling="no" noresize> </FRAMESET>

    Полностью код программы будет выглядить так:
    <HTML>
    <TITLE>Титул странички</TITLE> <FRAMESET rows="5%,*,5%" >
    <FRAME src="top.htm" name="top_page" scrolling="no" noresize>
    <FRAMESET cols="30%,70%" >
    <FRAME src="main_mnu.htm" name="main_mnu" scrolling="auto" noresize>
    <FRAME src="content.htm" name="content" scrolling="auto" noresize>
    </FRAMESET>
    <FRAME src="bottom.htm" name="bottom_page" scrolling="no" noresize> </FRAMESET>
    Заметьте, что документ, описывающий набор фреймов, не содержит тэга <BODY>. Он должен задавать только структуру фреймов и больше ничего.
    Чтобы ваша страничка была видна в браузерах не поддерживающих фреймы, следует указать тэг <NOFRAMES></NOFRAMES>, внутри контейнера <FRAMESET>.
    К таким браузерам относятся браузер NSCA Mosaic, IE2.0 и NN версии ниже чем 2.0.

    Например:
    <FRAMESET>
    <NOFRAMES>
    <BODY bgcolor="red"> Ваш браузер не поддерживает фреймы. </BODY> </NOFRAMES>
    </FRAMESET>

    Теперь создадим файл main_mnu.htm, где будет главное меню сайта..
    <HTML>
    <BODY BGCOLOR="gray">
    <A HREF="menu1.htm" TARGET="content">1. Первый элемент меню</A><BR> <A HREF="menu2.htm" TARGET="content">2. Второй элемент меню</A><BR>
    </HTML>