Пример использования графической карты ссылок

Приведем практический пример создания изображения-карты. Выберем изображение безымянный.gif и определим его размеры - ширина 200 пикселов и высота 150 пикселов. Определим три фигуры: прямоугольник с вершинами (110,30) и (178,79); круг с центром в точке (70,106) и радиусом 30; треугольник с вершинами (75,25), (31,69) и (12,11). Вам рекомендуется сделать поясняющий рисунок. Пусть первая фигура должна загружать файл lesson1.htm из каталога с текущим документом, вторая - вызывать переход в начало документа, а третья -загружать файл dolphin.jpg в новый экземпляр броузера (для этого в соответствующем тэге AREA нам потребуется атрибут target=_blank).

Вот как выглядит описание изображения-карты:

<center><img src="hotstou3.gif" width="200" height="150" usemap="#mymap"></center> <map name="mymap">

<area shape="rect" coords="110,30,178,79" href="lesson1.htm" title="Урок 1">

<area shape="circle" coords="70,106,30" href="#totop" title="К началу этого урока"> <area shape="poly" coords="75,25,31,69,12,11" href="dolphin.jpg"

title="Рисунок" target=_blank> </map>

Вот как будет выглядеть изображение-карта на экране браузера:

Выбранный рисунок с четко видимыми геометрическими фигурами служит наглядным примером изображения-карты. Как уже говорилось, на практике для изображения-карты можно использовать любой графический файл, изображение которого соответствует назначению изображения-карты. Задания:

1. Сделайте на странице меню, со ссылками на методические рекомендации и поисковые системы.

2. Сделайте внизу страницы ссылку, возвращающую пользователя в начало (вверх страницы). 3. Измените стандартные цвета, принятые для ссылок в своем документе (ответ на данный

вопрос найдите самостоятельно в учебниках!)

4. Создайте на своей странице графическую карту ссылок. Оформите отчет по проделанной работе, который должен содержать:

Формат записи рассмотренных на лабораторной работе тегов, их атрибуты и назначение. Для этого начертите и заполните таблицу, в которой в одном столбце указывается тэг, в другом описывается его назначение, а далее все возможные для него атрибуты.

Контрольные вопросы:

1. Рисунок в качестве фона. Какой тег для этого используется, какие атрибуты у него могут быть? Как зафиксировать фоновый рисунок под текстом, чтобы при прокручивании он не перемещался?

2. В какой форме можно задавать цвет в HTML?

3. Как изменить стандартные цвета для активной и посещенной ссылок?

4. Создание ссылок на другую часть текущей страницы (например, вверх страницы). 5. Чем отличаются клиентские и серверные графические карты ссылок?

6. Как создать графическую ссылку-миниатюру (то есть маленькое изображение является ссылкой, при нажатии на которую открывается тоже изображение, но в полный размер)?

7. Как задать ссылку на e-mail автора страницы.

Практическая работа №6 «Таблицы на WEB странице»

Цель работы: познакомиться с тэгами для создания таблиц, строк, ячеек, с их атрибутами, а также создавать простые и сложные таблицы, создавать макет страницы с помощью таблиц