|
Читайте также: |
При создании многооконной Web-страницы помимо применения фреймовой структуры на базе тэга <FRAMESET>... </FRAMESET> (см. пункт 1.1) также могут быть использованы плавающие фреймы. В этом случае в HTML-документе вместо тэга <FRAMESET>... </FRAMESET> используется, как и во всех остальных Web-страницах, тэг <BODY>... <BODY>.
Плавающий фрейм, подобно изображению, будет располагаться на экране в том месте, которое соответстует расположению тэга с его описанием в HTML-документе. Для задания плавающего фрейма используется тэг-контейнер <IFRAME></IFRAME>. Поскольку плавающий фрейм во многом объединяет свойства и фрейма, и изображения, то он имеет часть параметров (MARGINHEIGHT, MARGINWIDTH, NAME, SCROLING, SRC, BORDERCOLOR), которые свойственны фреймам и рассмотрены в пункте 1.2, другая часть его параметров (ALIGN, HEIGHT, WIDTH, HSPACE, VSPACE) характерна для изображений и рассмотрена в лабораторной работе №5 в пункте 1.1.
Ниже приведен пример задания плавающего фрейма, с именем "ff", размером 200*200 пикселей, в который загружается Web-страница с адресом "prim3-1.htm":
<IFRAME NAME="ff" SRC="prim3-1.htm" HEIGHT=200 WIDTH=200></IFRAME>
В примере № 1 наряду с обычными фреймами показано применение плавающих фреймов (в файле "left.htm").
3 Разработка многооконной Web-страницы
В примере (№ 1) показано построение трехоконной Web-страницы, имеющей соответственно три фрейма: один горизонтальный ("title") и два вертикальных ("left" и "right").
Пример 1
<HTML>
<HEAD>
<TITLE> Фреймы на Web-странице </TITLE>
<.HEAD>
<FRAMESET ROWS="60,*" FRAMESPACING=0>
<FRAME NAME="title" NORESIZE SCROLLING="no" MARGINHEIGHT=0 MARGINTEIGHT=0 SRC="title.htm" STYLE= "border: red 6 dashed" >
<FRAMESET COLS="30%,*" FRAMESPACING=2 >
<FRAME NAME="left" SRC="left.htm" FRAMEBORDER=0 >
<FRAME NAME="right" SRC="lab1.htm" FRAMEBORDER=1 BORDERCOLOR=#0000E0 >
</FRAMESET>
</FRAMESET>
</HTML>
Как видно из фреймовой структуры экран сначала делится на два горизонтальных окна: первое окно имеет размер 60 пикселов, второе занимает оставшуюся часть экрана. Затем второе горизонтальное окно делится на два вертикальных с размерами соответственно 30% и 70% экрана.
3.1 Фрейм "title"
Фрейм "title" используется для задания общих или заголовочных сведений. Может быть использован как домашняя страница (home page). В нем запрещены полосы прокрутки и изменение размера окна.
Файл "title.htm", загружаемый в окно "title", содержит HTML-документ из двух строк, задающих цвет фона, параметры надписи и саму надпись:
<P STYLE ="background:#E0FFE0; color:#0000C0; font: italic 10mm; text-align:center"> ИЗУЧЕНИЕ HTML
3.2 Фрейм "left"
Файл "left.htm", загружаемый в окно "left" содержит HTML-документ, в котором задан набор ссылок в виде кнопок, осуществляющих доступ к описаниям лобораторных работ, и плавающий фрейм:
<HTML>
<HEAD>
<LINK REL=stylesheet HREF="my_d.css">
</HEAD>
<BODY>
<A CLASS="kn" HREF="lab2n.htm" TARGET="right"> Лаб. раб. №2 </A> <BR>
<A CLASS="kn" HREF="lab3n.htm" TARGET="right"> Лаб. раб. №3 </A> <BR>
<A CLASS="kn" HREF="lab4n.htm" TARGET="right"> Лаб. раб. №4 </A> <BR>
<A CLASS="kn" HREF="lab5n.htm" TARGET="_top"> Лаб. раб. №5 </A> <BR>
<A CLASS="kn" HREF="lab6n.htm" TARGET="ff"> Лаб. раб. №6 </A> <BR><BR>
<IFRAME NAME="ff" SRC="prim2-2.htm" HEIGHT=200 WIDTH=200></IFRAME> </BODY>
<HTML>
Первые три ссылки загружают Web-страницы с описаниями лабораторных работ №2, №3 и №4 во фрейм с именем "right", четвертая ссылка загружает Web-страницу с описанием лабораторной работы №5 во весь экран, а последняя ссылка загружает Web-страницу с описанием лабораторной работы №6 в плавающий фрейм с именем "ff".
Дата добавления: 2014-12-18; просмотров: 47 | Поможем написать вашу работу | Нарушение авторских прав |