Автор работы: Пользователь скрыл имя, 27 Октября 2013 в 19:38, реферат
Основа каждой странички — язык разметки гипертекста, или HTML (Hypertext Markup Language).
Документ, который написан на языке HTML, представляет собой простой текст, в который вставлены флаги разметки, или "тэги" (markup tags). Флаги разметки объясняют компьютеру, как должен быть расположен текст на экране, в каком месте должны находиться рисунки, хранящиеся в совсем других файлах и так далее. С помощью флагов разметки формируются связи с другими web-сайтами и ресурсами Интернет.
<р> Ссылка на документ <А HREF="c.htm"> c.htm </А> Если Вы загрузите базовый пример с двумя рамками и активизируете ссылку, то получите содержимое страницы С, отображенное внутри рамки А.
Измените страницу baza.htm:
<HTML>
<HEAD> <TITLE> Демонстрация фреймов </TITLE> </HEAD>
<FRAMESET COLS="50%, 50%">
<FRAME SRC="a.htm">
<FRAME SRC="b.htm" NAME-"FRAME_B ">
</FRAMESET>
</HTML>
Добавление имени не отражается на его внешнем виде — это лишь внутреннее изменение. Но Вы можете использовать это имя в качестве параметра атрибута TARGET флага <А> в файле a.htm:
<А HREF-"«c.htm" TARGET="FRAME_B">c.htm</А>
Посмотрев страницу baza.htm в программе просмотра, Вы обнаружите, что содержимое страницы С отображается теперь внутри фрейма В. Такой подход хорошо работает, когда Вы используете страницы, расположенные на Вашем узле. Если же Вы захотите связаться со страницей, расположенной по другому адресу, то окажется, что содержимое всей страницы будет отображено внутри рамки.
Добавьте в файл a.htm ссылку:
<а href="//C-server/net/html/
Проверьте эту ссылку на странице baza.htm
На экране Вы увидите, что страничка, на которую Вы дали ссылку, открылась внутри рамки.
Чтобы страничка открывалась
<а href="//C-server/net/html/
«Плавающие» рамки
Такие рамки могут появляться в любом месте экрана, причем текст, расположенный на главной странице, как бы обтекает плавающую рамку. Для создания плавающих рамок применяется специальный флаг <IFRAME> и парный ему флаг < /IFRAME >:
<IFRAME SRC=n name=m> N </IFRAME>
В данном случае
n — адрес или имя открываемой рамки,
m — название самой рамки,
N — тот ресурс, который увидят
перед собой пользователи
Создайте файл demo.htm. При создании плавающей рамки укажите, что она занимает 50% экрана и имеет высоту в 300 пикселей. С помощью атрибута align задайте
выравнивание справа от текста:
<HTML>
<HEAD> < TITLE >Демонстрация фреймов. Главная страница. </TITLE> </HEAD>
<BODY bgcolor="FFCCFF">
<IFRAME ALIGN=RIGHT WIDTH=50% HEIGHT=300 SRC="a.htm"> </IFRAME>
<H1> <CENTER> Пример «плавающего» фрейма </CENTER> </Н1>
<H3>
Фрейм справа от данного текста является «плавающим» - он размещен на данной
странице с помощью
</НЗ>
</BODY>
</HTML>
На экране программы просмотра Вы увидите "плавающую" рамку-фрейм.
Пример использования рамок
На странице, состоящей из двух рамок, расположим ссылки на поисковые системы в World Wide Web. В правом фрейме будет отображаться пояснительный текст. Создайте на языке HTML следующие файлы.
Файл deino2.htm:
<HTML>
<HEAD> <TITLE> Демонстрация фреймов </TITLE> </HEAD>
(
<FRAMESETCOLS-»25%, *">
<FRAME SRC="left.htm">
<FRAME SRC -»right.htm ">
</FRAMESET>
</HTML>
Файл left.htm:
<HTML>
<HEAD> <TITLE> Поиск в Интернет </TITLE> </HEAD>
<BODY BGCOLOR="#CCCCFF">
<H3> <CENTER> <B> Поиск информации в Интернет <B> <CENTER> <H3>
<HR>
<UL>
<LI> <A HREF=http://www.rambler.ru/ TARGET=_bIank> <B> Rambler </B> </A> <LI> <A HREF=http://www.aport.ru/ TARGET=_blank> <B> Апорт </B> </A>
<LI> <A HREF="http://www.yandex.ru" TARGET=_blank> <B> Яndex </B> </A> </UL>
<HR>
</BODY>
</HTML>
Файл right.htm:
<HTML>
<HEAD> <TITLE> Демонстрация фреймов </TITLE> </HEAD>
<BODY BGCOLOR="#FFCCFF">
<H1> <I> Поисковые системы World Wide Web </I> </Hl>
<H4>
В списке слева перечислены различные поисковые системы, доступные в World Wide Web. Активизация той или иной ссылки приводит к вызову главного окна соответствующей системы в новом окне.
</Н4> <HR>
</BODY>
</HTML>
Откройте полученный HTML-документ (demo2.htm) в программе просмотра и попробуйте воспользоваться ссылками, размещенными в левой рамке. Сделайте свой пример с использованием рамок.
Если программа просмотра не поддерживает рамки
В случаях, когда есть вероятность того, что у пользователя может быть программа просмотра, не поддерживающая рамки, встает вопрос о том, как отображать информацию. Чтобы те, чья программа не поддерживает рамки, увидели Вашу страничку, следует воспользоваться специальным флагом <NOFRAMES>. Ниже показан шаблон страницы, использующей рамки, и приведен текст для тех пользователей, которые их «не видят».
<FRAMESET>
... Здесь располагаются фреймы
</FRAMESET>
<NOFRAMES>
<BODY>
...Здесь располагается текст без фреймов
</BODY>
В секции, предназначенной для тех пользователей, которые «не видят» рамки, можно
расположить какой-нибудь пояснительный текст:
<HTML>
<HEAD> < TITLE > ... </TITLE> </HEAD>
<BODY BGCOLOR="#CCCCFF">
<CENTER> <B> <HR>
Чтобы увидеть фреймы, вам следует использовать более новую версию браузера.
<Р> Например, браузер Microsoft Internet Explorer 5.0
<HR> </B> </CENTER>
</BODY>
</HTML>
Карты
Карты — это замечательный способ сделать различные части одного графического изображения гиперссылками на различные документы.
Карта (ее иногда называют карта-меню) может иметь вид набора кнопок и значков, нарисованных художником-дизайнером, или списка текстовых пунктов меню. А может выглядеть и как настоящая карта: щелкаете по кружочку, обозначающему город и отправляетесь на виртуальную экскурсию по нему.
Все карты одинаково появляются на свет — Вы создаете изображение, содержащее кнопки, или иные приспособления для перемещения, а затем с помощью программ создания карт-меню размечаете на этом изображении активные области, связывая с каждой областью некоторую Web-страницу.
Реакция на щелчок мышью на данной
карте-изображении будет
Чтобы изображение стало картой, нужно к флагу <IMG ...> добавить специальный атрибут ISMAP или USMAP и пояснить, что данное изображение является картой.
В отличие от рассмотренных нами ранее «пассивных» изображений, в данном случае при помощи атрибута USEMAP="#map" мы сообщаем программе просмотра, что она должна интерпретировать это изображение как карту и искать информацию о разбиении этого изображения на активные области по символическому имени карты тар.
Имя карты может состоять из латинских букв и цифр и не должно содержать пробелов, прописные и строчные буквы различаются. Обратите внимание на обязательный значок # в атрибуте USEMAP="#map" . Перед этим значком может находиться URL файла, если карта описана в нем отдельно от файла того документом, с которым эта карта используется. Описание активных областей изображения-карты начинается флагом
<МАР НАМЕ="имя_карты"> и
заканчивается флагом </МАР>. Каждая
область описывается при
<AREA SНАРЕ="форма" COORDS="список координат" HREF="url">,
где форма может принимать одно из четырех значений:
rect — прямоугольник,
poly — многоугольник,
circle — окружность,
default — «по умолчанию», то есть все части изображения, оставшиеся не описанными. Атрибут COORDS задает список координат. Для прямоугольной области — это координаты левого верхнего и правого нижнего углов, для многоугольной —координаты каждого из углов, для окружности — координата центра и радиус.
Все координаты отсчитываются в пикселях от левого верхнего угла экрана.
Атрибут HREF-"url" задает URL или путь к файлу с документом, на который данная область рисунка ссылается. Если вместо HREF="url" записано NOHREF, то данная область не является якорем гиперссылки, и щелчок на ней будет проигнорирован.
Добавьте в один из своих документов
следующие строчки и проверьте
результат в программе просмотр
<IMG SRC=«7/C-server/net/html/
<AREA SHAPE="rect" COORDS=" 12,0,80,50" HREF="//C-server/net/htmI/
Существуют специальные
Необходимо учитывать, что карты поддерживаются не всеми программами просмотра, к тому же, пользователи часто отключают загрузку изображений, в результате чего карты не появляются на экране. Поэтому следует дублировать все гиперссылки, созданные при помощи карт, обычными гиперссылками.