Создание страницы с фреймами.
Значительно улучшить внешний вид и функциональность сайта можно, используя фреймы. С помощью фреймов экран разделяется на несколько окон, в каждом из которых отображается содержимое отдельной страницы. Используя подобным образом технологию фреймов, можно одновременно загрузить в одно окно браузера несколько Web - страниц.
Размер фрейма может изменяться пользователем прямо в экране с помощью мыши. Каждый фрейм имеет собственный адрес, что позволяет отображать его независимо от других фреймов, и собственное имя, позволяющее переходить к нему из других фреймов. Такие свойства фреймов позволяют размещать в одном фрейме информацию, которую автор считает необходимым постоянно показывать пользователю. Это может быть логотип фирмы, набор управляющих кнопок, меню и т.д. С помощью фреймов можно создавать также окна запросов, когда в одном фрейме находится собственно запрос, а в другом - его результаты.
Посмотрим, как с помощью фреймов поместить в окне браузера меню для перехода на другие страницы сайта и сами страницы.
Для описания фреймов используется специальный HТML-файл
10.1. В окне программы Блокнот (Notepad) создайте новый файл
10.2. Введите основные теги, кроме тегов <body></body>, которые в файле, описывающем фреймы, не используются. В тегах <title></title> заголовка укажите – Группа Км.
Вместо тегов <body></body> в файле, описывающем фреймы, используется пара тегов <frameset></frameset> с атрибутами rows или cols, определяющими, как делится экран по горизонтали или по вертикали. В качестве значений этих атрибутов можно использовать числовое значение высоты или ширины фрейма в пикселах или в процентах от 1% до 100%. Например, если вы хотите разделить окно браузера по горизонтали на два равных по размеру фрейма, то код HTML должен быть таким:
<frameset rows="50%,50%">
Обратите внимание: значения атрибутов отделяются один от другого запятой. Чтобы разделить окно браузера по вертикали на два фрейма шириной 200 и 600 пикселов, следует написать:
<frameset cols=”200,600”>
Однако фактическая ширина и высота окна фрейма зависит от текущего разрешения монитора. Поэтому, если у пользователя установлено разрешение, например, 1024x768 пикселов, т.е. ширина экрана - 1024 пиксела, то часть экрана может остаться незаполненной. Поэтому рекомендуется задавать размеры фреймов в процентах так, чтобы их сумма была равна 100%. Если все же необходимо для одного из окон указать фиксированный размер в пикселах, то размер другого окна можно не указывать, заменив его значение символом В этом случае браузер сам подберет нужный размер для второго окна. Создадим для отображения нашего сайта два вертикальных фрейма. Для первого фрейма, в котором будет выводиться меню, установим фиксированную ширину - 160 пикселов, а размер второго предоставим определить браузеру, заменив его звездочкой. Для описания каждого фрейма в отдельности используются одиночные теги <frame>, которые должны находиться внутри элемента <fraimeset>. ..</frameset>. Обязательным атрибутом тега <frame> является src, значение его - адрес документа, который должен находиться в данном фрейме. Так как в первом фрейме будет находится файл menu.html, то данный тег следует записать так:
<frame src ="menu.html">
10.3. В окне программы Блокнот (Notepad) вставьте пустую строку после закрывающего тега </head> и введите следующий код:
<frameset cols=160,*>
</frameset>
10.4. Вставьте в окне программы Блокнот (Notepad) пустую строку после открывающегося тега <frameset> и введите указанный тег:
<frame src ="menu.html">
10.5. Во второй фрейм должен загружаться файл Km.html, поэтому второй тег <frame> будет таким:
<frame src=”Km.html" name=”frame”>
Именно для того, чтобы при переходе по ссылками нашего меню страницы открывались не в первом фрейме, в котором расположено меню, а во втором, мы использовали в предыдущем пункте в ссылках меню атрибут target со значением "frame": target="frame", где "frame" - это имя второго фрейма. И теперь имя "frame" следует присвоить второму фрейму, в котором должен открываться файл geoton.html. Поэтому второй тег <frame> в окончательном виде должен быть записан так, как мы записали.
10.6. Сохраните файл в папке Web под именем index.html
10.7. Откройте в браузере файл index.html из папки Web. Вы увидите, что окно программы просмотра разделено по вертикали на два фрейма. В левом фрейме отображается меню, а в правом -файл КМ.html
10.8. Проверим, как работают ссылки меню:
10.8.1. Щелкните мышью на ссылке меню Чем мы занимаемся? В правом фрейме будет открыт файл spisok.html.
10.8.2. Щелкните мышью на ссылке меню Главная страница. В правом фрейме снова появится файл KM.html
10.9. Мы создали сайт из двух Web-страниц. Теперь, чтобы он стал доступен всем, его необходимо поместить в Интернете на один из серверов World Wide Web.