Главная | Обратная связь | Поможем написать вашу работу!

Создание обычной гиперссылки.

Tема №10 Интернет технологии

Теоретический блок

Создание рамок и форм.

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

Web-страница также может служить мощным рекламным орудием, позволяя владельцу страницы контактировать с ее посетителем. Компания, рекламирующая свой товар или сервис на Web-странице, может тут же предложить потенциальному клиенту заполнить анкету и выслать ее обратно (по сети Internet, естественно). В ответ на это клиент персонально может получить дополнительную информацию (это может быть сделано через обычную или электронную почту) или продукт, который он заказал в компании, заполнив анкету. Формы размещаются между тэгами <FORM>... </FORM>. HTML-документ может содержать в себе несколько форм, но они не должны находиться одна внутри другой. Тэг <FORM> может содержать следующие атрибуты:

Атрибут	Функция
ACTION	Обязательный атрибут. Определяет, где находится обработчик формы.
METHOD	Определяет, каким образом данные из формы будут переданы обработчику. Допустимые значения: METHOD=POST и METHOD=GET. Если значение атрибута не установлено, по умолчанию предполагается METHOD=GET
ENCTYPE	Определяет, каким образом данные из формы будут закодированы для передачи обработчику.

Для внесения информации пользователем в форму используется элемент <INPUT>. Это и есть поля, в которые пользователь вводит информацию. Каждый элемент <INPUT> включает атрибут NAME=имя, определяющий имя данного поля (идентификатор поля). В таблице представлены основные типы применяемых элементов <INPUT>:

Атрибут	Функция
TYPE=text	Определяет окно для ввода строки текста. Может содержать дополнительные атрибуты SIZE=число (ширина окна ввода в символах) и MAXLENGTH=число (Максимально возможное число символов, вводимых в поле): <INPUT TYPE=text SIZE=20 NAME=User VALUE="LENIN INC"> Определяет окно шириной 20 символов для ввода текста. По умолчанию в окне находится текст LENIN INC, который пользователь может изменить.
TYPE=password	Определяет окно для ввода пароля. Абсолютно аналогичен типу text, только вместо символов вводимого текста показывает на экране звездочки (*): <INPUT TYPE=password NAME=PW SIZE=20 MAXLENGTH=10> Определяет окно шириной 20 символов для ввода пароля. Максимально допустимая длина пароля — 10 символов.
TYPE=radio	Определяет радиокнопку. Может содержать дополнительный атрибут CHECKED (показывает, что кнопка отмечена). В группе радиокнопок с одинаковыми именами может быть только одна помеченная радиокнопка: <INPUT TYPE=radio NAME=Question VALUE="Yes" CHECKED> Да <INPUT TYPE=radio NAME=Question VALUE="No"> Нет <INPUT TYPE=radio NAME=Question VALUE="Possible"> Возможно Да Нет Возможно Определяет группу из трех радио кнопок, подписанных Yes, No и Possible. Первоначально помечена первая из кнопок. Если пользователь не отметит другую кнопку, обработчику будет передана переменная Question со значением Yes. Если пользователь отметит другую кнопку, обработчику будет передана переменная Question со значением No или Possible.
TYPE=checkbox	Определяет квадрат, в котором можно сделать пометку. Может содержать дополнительный атрибут CHECKED (показывает, что квадрат помечен). В отличие от радио кнопок, в группе квадратов с одинаковыми именами может быть несколько помеченных квадратов: <INPUT TYPE=checkbox NAME=Comp VALUE="CPU"> Процессоры <INPUT TYPE=checkbox NAME=Comp VALUE="Video" CHECKED> Видеоадаптеры <INPUT TYPE=checkbox NAME=Comp VALUE="Scan"> Сканеры <INPUT TYPE=checkbox NAME=Comp VALUE="Modem" CHECKED> Модемы Процессоры Видеоадаптеры Сканеры Модемы Определяет группу из четырех квадратов. Первоначально помечены второй и четвертый квадраты. Если пользователь не произведет изменений, обработчику будут переданы две переменные: Comp=Video и Comp=Modem.
TYPE=hidden	Определяет скрытый элемент данных, который не виден пользователю при заполнении формы и передается обработчику без изменений. Такой элемент иногда полезно иметь в форме, которая время от времени подвергается переработке, чтобы обработчик мог знать, с какой версией формы он имеет дело. <INPUT TYPE=hidden NAME=version VALUE="1.1"> Определяет скрытую переменную version, которая передается обработчику со значением 1.1.
TYPE=submit	Определяет кнопку, при нажатии на которую запускается процесс передачи данных из формы обработчику: <INPUT TYPE=submit VALUE="Отправить">
TYPE=reset	Определяет кнопку, при нажатии на которую очищаются поля формы. Поскольку при использовании этой кнопки данные обработчику не передаются, кнопка типа reset может и не иметь атрибута name: <INPUT TYPE=reset VALUE=" Сброс ">

Формы могут содержать поля для ввода большого текста <TEXTAREA>:

<TEXTAREA NAME=address ROWS=5 COLS=50> Наберите здесь сообщение</TEXTAREA>

Атрибут NAME определяет имя, под которым содержимое окна будет передано обработчику. Атрибут ROWS устанавливает высоту окна в строках. Атрибут COLS устанавливает ширину окна в символах. Текст, размещенный между тэгами <TEXTAREA>…</TEXTAREA>, представляет собой содержимое окна по умолчанию. Пользователь может его отредактировать или просто стереть.

Кроме всего этого формы могут содержать меню выбора, которое начинается открывающимся тэгом <SELECT> (содержит обязательный атрибут NAME, определяющий имя меню) и завершается закрывающимся </SELECT>. Между ними находятся тэги <OPTION>, определяющие элемент меню. Обязательный атрибут VALUE устанавливает значение, которое будет передано обработчику, если выбран этот элемент меню. Тэг <OPTION> может включать атрибут selected, показывающий, что данный элемент выбран/отмечен по умолчанию.

<SELECT NAME="имя"> <OPTION VALUE="option_1" selected>текст 1 <OPTION VALUE="option_2">текст 2 <OPTION VALUE="option_n">текст n </SELECT>

Тэг <SELECT> может также содержать атрибут MULTIPLE, присутствие которого показывает, что из меню можно выбрать несколько элементов. Большинство Обозревателей показывают меню <SELECT MULTIPLE> в виде окна, в котором находятся элементы меню. Высоту окна в строках можно задать атрибутом SIZE=число.

<SELECT MULTIPLE SIZE=3 NAME="имя"> <OPTION VALUE="option_1" selected>текст 1 <OPTION VALUE="option_2">текст 2 <OPTION VALUE="option_n">текст n </SELECT>

Пример 1:

<HTML>

<HEAD>

<TITLE>

ПРИМЕР

</TITLE>

</HEAD>

<H4>Анкета трудоустройства</H4>

Адрес:<BR>

Телефон:<BR>

<INPUT TYPE="RADIO" NAME="Выбор1" VALUE="Мужчина">Мужчина<BR>

<INPUT TYPE="RADIO" NAME="Выбор1" VALUE="Женщина">Женщина

Понятие фрейма. Фрейм (от англ. Frame-рамка, каркас, кадр) представляет собой отдельное рабочее окно браузера, в ряде случаев разделенное еще на несколько различных по параметрам и размеру фреймам. Совокупность таких окон принято называть фреймовой структурой. Каждый фрейм-это не что иное, как отдельный HTML-документ, загружающийся браузером в предназначенном для него окне. Таким образом, HTML-документ, созданный на фреймовой основе, является набором взаимосвязанных электронных документов, параметры и свойства которых определяются настройками всей фреймовой структуры. Основные преимущества фреймовых структур.1. Фреймы позволяют экономить на объеме пересылаемых пользователю файлов, т.к. после активизации ссылки изменяется только один фрейм.2. Возможность перехода по другим ссылкам в пределах Интернет-ресурса при неизменном доступе к панели навигации заметно облегчает навигацию по электронным документам.3. Возможность работы сразу с несколькими информационными блоками в пределах одного окна позволяет сэкономить время.4. Использование правил описания фреймовых структур позволяет разработчику HTML-документов как угодно варьировать размеры полей фреймов, что дает более широкий спектр возможностей пространственного размещения объектов.

Итак, отдельная рамка определяется одиночным ярлыком <FRAME>, который также имеет инструкцию SRC(sourse-источник) для описания файла, который размещается в данной рамке. Полный синтаксис выглядит следующим образом:

<FRAME SRC= “имя файла.html”> Имя файла надо давать полностью, включая все директории, если он расположен не в той директории, где находится файл с рамкой. Сложность заключается в определении совокупности рамок (frameset) на одной странице. Это делается с помощью двойного ярлыка <FRAMESET>…</FRAMESET>. В пределах этого ярлыка можно определить отдельные рамки, их взаимное расположение и размеры. Допустим, мы хотим создать страницу с трем горизонтальными рамками, которые содержат файлы, созданные нами ранее, а именно:<FRAME SRC="1.html"><FRAME SRC="2.html"><FRAME SRC="3.html"> Для этого в ярлыке < FRAMESET> надо добавить параметр ROWS (для вертикального расположения рамок следует дать инструкцию COLS) и указать размеры рамок. При этом размеры рамок могут быть указаны одним из трех способов: а)абсолютный размер в пикселях; б)размер в процентах по отношению к высоте (для ROWS) или ширине (для COLS) страницы); в) относительные размеры рамок. Мы будем использовать случаи «б» и «в» как наиболее наглядные. Итак, рассмотрим для иллюстрации следующий. html-файл. Прмер 2. <html> <head> <title> Пример 2 </title> </head> <FRAMESET COLS="50%,50%"><FRAMESRC="1.html">

Гипертекстовые ссылки.

Создание обычной гиперссылки.

В Интернете размещены миллионы электронных документов, часто похожих по тематике и ориентированных на одну и ту же пользовательскую аудиторию. Переход на другие документы казался бы делом трудным и утомительным, если бы не возможность связывания одного HTML-документа с другим с помощью гипертекстовых ссылок.

По сути, любая гипертекстовая ссылка-это указатель адреса в глобальной сети, по которому можно моментально перейти из окна браузера. Успешный переход по ссылке возможен в двух случаях: если ресурс, на который ссылается документ, существует и если структура гиперссылки верна с точки зрения HTML.

Структура гиперссылок

Любая гиперссылка состоит из двух важных частей: указателя ссылки и адреса ресурса, на который необходимо осуществить переход. Внешнее отличить гиперссылку от обычного текста очень просто: при наведении курсора мыши на ссылку указатель принимает вид руки с указательным пальцем, как бы показывающим, что этот текст содержит гиперссылку. Сама ссылка подчеркивается (если указателем является текст).

В качестве ссылки может выступать текст (отдельное слово, фразы и даже целые страницы текста) и графические изображения. В ряде случаев возможно объединение графики и текста в рамках единого указателя ссылки. Указатель ссылки описывается тэгом <A>, а адрес перехода реализуется с помощью параметра HREF значением которого является путь к тому или иному Интернет-ресурсу (закрывающий тэг </A> является обязательным). Ссылки HTML позволяют связать текст или картинку с другими гипертекстовыми документами. Текст, как правило, выделяется цветом или оформляется подчеркиванием. Вот обычная конструкция ссылки:

<A HREF="URL" TARGET="Окно" TITLE="Подсказка">Название ссылки</A>

Параметры элемента <A> представлены в таблице:

Атрибут	Функция
HREF	URL (унифицированный локатор ресурсов) - адрес любого файла в Интернете. Может быть абсолютным, то есть указывается полный адрес странички (например, http://lenininc.narod.ru/index.html) и относительным, как видно из названия указывается файл относительно текущего (например, index.html).
TARGET	Определяет, в каком окне (фрейме) загрузить гиперссылку. Может иметь значения: top - загружает гиперссылку на всем пространстве окна браузера (если до этого существовало разбиение на фреймы, то оно исчезнет). blank - загружает гиперссылку в новом окне браузера. self – загружает содержимое страницы в окно, которое содержит эту ссылку (и так используется по умолчанию, так что если вам надо именно так загрузить ссылку, то параметр target вообще можно не использовать). parent - загружает содержимое страницы, заданной ссылкой, в окно, являющееся непосредственным владельцем набора фреймов.
TITLE	Текст подсказки, который будет появляться при наведении мышки на гиперссылку. Параметр не обязательный.

12 3 4 Следующая ⇒

Воспользуйтесь поиском по сайту: