| Есть ли практическая часть у курса повышения квалификации «web-дизайн»? |
Преподаватель
Вы можете этот курс.
Опубликован: 19.03.2007 | Уровень: для всех | Доступ: свободно
Лекция 10:
Использование фреймов
Задание фрейма в ссылке
После создания множества фреймов и загрузки фреймов начальными документами, надо иметь возможность открывать во фреймах другие документы. Рассмотрим случай множества фреймов с меню ссылок в левом фрейме и соединенными документами, которые выводятся в правом фрейме. Щелчок на ссылке во фрейме меню открывает соответствующий документ во фрейме документов.
Показанное выше приложение имеет приведенный ниже документ frameset. Этот документ Wonders.htm открывается в браузере, чтобы вывести набор фреймов.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Seven Wonders of the World</title>
</head>
<frameset rows="20%,80%" frameborder="0" framespacing="0">
<frame src="Title.htm" scrolling="no"/>
<frameset cols="20%,80%" frameborder="0" framespacing="0">
<frame src="Menu.htm"/>
<frame src="Home.htm" name="Content"/>
</frameset>
</frameset>
</html>
Листинг
10.9.
Код страницы множества фреймов
Это составной набор фреймов с вложением. Внешний набор фреймов состоит из двух строк ( rows ). Верхняя строка является фреймом, в который загружается заголовок документа (Title.htm); нижняя строка является вложенным набором фреймов. Это второе множество фреймов состоит из двух столбцов. В левый фрейм загружается документ меню (Menu.htm); в правый фрейм вначале загружается открывающая страница сайта (Home.htm). Для правого фрейма задано также имя ( name="Content" ), так как он является фреймом для вывода документов, соединяемых из фрейма меню.
Отметим, что множество фреймов не выводит границы, так как в тегах <frameset> задано frameborder="0" и framespacing="0" ( framespacing необходимо задать равным 0, чтобы исключить незначительное свободное пространство между фреймами, даже когда границы не выводятся.) Также для верхнего фрейма задан атрибут scrolling="no", чтобы подавить выводимую по умолчанию полосу прокрутки.
Атрибут target
Соединенные документы загружают во фреймы, задавая атрибут target="framename" в теге анкера <a>. Атрибут target определяет имя фрейма (заданное в теге <frame name="framename"/> ), в котором открывается документ. Поэтому страница Menu.htm, которая загружается выше в левый фрейм, кодируется следующим образом, чтобы направлять соединенные страницы в именованный фрейм "Content".
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Menu Page</title>
<style type="text/css">
body {background-color:#F0F0F0}
h2 {text-align:center}
</style>
</head>
<body>
<h2>Menu</h2>
<div>
<a href="Artemis.htm" target="Content">Artemis</a><br/>
<a href="Colossus.htm" target="Content">Colossus</a><br/>
<a href="Gardens.htm" target="Content">Gardens</a><br/>
<a href="Halicarnassus.htm" target="Content">Halicarnassus</a><br/>
<a href="Lighthouse.htm" target="Content">Lighthouse</a><br/>
<a href="Pyramid.htm" target="Content">Pyramid</a><br/>
<a href="Zeus.htm" target="Content">Zeus</a><br/>
</div>
</body>
</html>
Листинг
10.10.
Код для направления ссылок в именованный фрейм
Хотя документ, выводимый в правом фрейме, изменяется при каждом выборе в меню, сам документ меню всегда остается в левом фрейме. Он не должен перезагружаться каждый раз, когда выводится страница с новым документом.
