Теоретический материал

1. Основные сведения. Существует три типа ссылок: внутристраничные – они задают переходы в пределах одной страницы; внутрисистемные – ссылки между страницами в пределах одного и того же сервера; и межсистемные – ссылки на страницы, расположенные на удаленных узлах Web. Для определения ссылок предназначен специальный тег, который называется Anchor (якорь). Описание тега <A>…</A>: в документе создается гиперссылка (атрибут href) или идентификатор фрагмента (атрибут name).

1.1. Внутристраничные ссылки:

- Создать имя (метку) для точки назначения, в которую должен осуществляться переход. Метка создается с помощью тега якоря, используя его атрибут NAME (например, <A NAME=”info”> Дополнительная информация </A>). Фраза "Дополнительная информация" при этом никак не будут выделены в тексте документа.

- Для создания гиперссылки на эту точку документа используется тег <A> с атрибутом HREF=, при этом к имени якоря присоединяется знак #: (например, <A HREF=”#info”> Просмотр дополнительной информации </A>). Такой фрагмент HTML-текста приведет к появлению в документе выделенного фрагмента (в нашем случае фразы Просмотр дополнительной информации), при нажатии на который произойдет переход к строчке Дополнительна информация.

1.2. Внутрисистемные ссылки:

- В файле, в который мы хотим перейти необходимо создать метку аналогично п. 1.Создать гиперссылку аналогично п. 1., только имя якоря присоединяется к имени файла через знак # (например, Кратко о моих увлечениях и хобби можно посмотреть <A HREF=”about.html#info”> здесь </A>). При нажатии на выделенный фрагмент произойдет переход строчке #info в файле с именем about.html.

- Задание: В файл main.html добавить абзац «Еще об HTML можно посмотреть здесь» после абзаца ls@nexcom.ru

- Создать файл about.html, содержащий абзац “Вся информация о форматировании документа сосредоточена в его фрагментах, заключенных между знаками "<" и ">". Такой фрагмент называется меткой (по-английски — tag, читается "тэг").”

- В начале файла about.html фразу «Вся информация» заключить в теги <A NAME=”info”> и </A>.

- В документе main.html слово «здесь» оформить гиперссылкой на документ about.html на якорь «info»

- Используя атрибут link тега body, изменить цвет гиперссылки на черный.

- Опробовать действие гиперссылки.

- В файл about.html внизу страницы поместить абзац, состоящий из одного слова «Назад», выровненного по центру.

- Организовать обратный переход.

1.3. Межсистемные ссылки. Используя эти ссылки можно установить связь с любой страницей на любом узле Web.

- В этом случае необходимо создать только гиперссылку, например, ссылка на сервер фирмы Microsoft выглядит следующем образом: <A HREF="http://www.microsoft.com"> Переход на сервер компании Microsoft </A>. При нажатии на выделенный фрагмент произойдет переход на сервер фирмы Microsoft.

- Задание: в документ main.html добавить абзац «Здесь вы можете посмотреть сервер Челябинского государственного металлургического колледжа».

- Оформить абзац по своему усмотрению.

- Оформить абзац как гиперссылку на адрес http://metkol.ru..

- Адрес e-mail внизу страницы оформить следующим образом: <a href="mailto:ls@nexcom.ru ">здесь адрес e-mail</a>. Теперь пользователь сможет отправлять электронные письма по этому адресу.

- В документе about.html добавить гиперссылку на сервер Челябинского государственного металлургического колледжа и отправку электронной почты.

Лабораторная работа №5