Карты - это способ сделать различные части одного графического изображения гиперссылками. Они позволяют выделить отдельные области изображений и определить для каждой из них свое действие.
<IMG SRC=\"Map_example.jpg\" BORDER=\"0\" WIDTH=\"200\" HEIGHT=\"160\" ALT=\"Пример изображения-карты\" USEMAP=\"#Map_example\">
<MAP NAME=\"Map_example\">
<AREA SHAPE=\"rect\" COORDS=\"11,11,70,24\" TITLE=\"Ссылка 1\" HREF=\"URL\">
<AREA SHAPE=\"rect\" COORDS=\"70,72,128,83\" TITLE=\"Ссылка 2\" HREF=\"URL\">
<AREA SHAPE=\"rect\" COORDS=\"190,136,128,149\" TITLE=\"Ссылка 3\" HREF=\"URL\"> |
Как видите, чтобы создать карту нужно вставить в тег <IMG SRC=\"\"> атрибут USEMAP=\"#name\", где name - имя карты (значок # обязателен). В примере использовалось название Map_example. Я пропускаю остальные атрибуты в этом теге, Вы их должны знать, т.к. о них уже рассказывалось в предыдущей статье
Далее описываем активные области карты. Начинаем с открывающегося тега <MAP NAME=\"name\"> (здесь повторяется имя, но уже без значка #), а заканчиваем закрывающимся тегом </MAP>.
Между этими тегами помещаем описание каждой активной области изображения: <AREA SHAPE=\"форма\" COORDS=\"координаты\" HREF=\"адрес\" TITLE=\"альтернативный текст\">. Элемент <AREA> имеет следующие аттрибуты и их значения:
| SHAPE |
Описывает форму выделяемой области, возможные значения:
RECT - прямоугольник
CIRCLE - круг
POLY - многоугольник
DEFAULT - определяет всю область, т.е весь рисунок может стать ссылкой. |
| COORDS |
Координаты, определяющие размеры и положение области на изображении. Все координаты отсчитываются в пикселях от левого верхнего угла изображения. Количество и порядок значений зависит от значения аттрибута SHAPE:
RECT: - левый-X, верхний-Y, правый-X, нижний-Y (т.е. сначала координаты левого верхнего угла, затем правого нижнего)
CIRCLE: - центр-X, центр-Y, радиус (т.е. горизонтальная и вертикальная координаты центра круга и радиус)
POLY: - X1, Y1, X2, Y2, ..., Xn, Yn (просто перечисляются координаты всех вершин многоугольника). |
| NOHREF |
Определяет, что данной области не соответствует никакая ссылка. Где это может пригодиться? Ну, например, если вы хотите сделать ссылку не в виде круга, а в виде кольца |
| ALT |
Альтернативный текст для выделенной области, используется невизуальными браузерами. |
| TITLE |
Название выделенной области, выводится в виде подсказки, всплывающей при наведении курсора на область рисунка. |
| TARGET |
Значение этого аттрибута (\"_top\", \"_blank\", \"_self\" или \"_parent\") определяет, в каком окне будет открыт документ |
Для того, чтобы рассчитать точно координаты нужной части изображения существуют специальные программы. Одна из них называется MapEdit.
 |
|
 |
 |
|
|
Cascading Style Sheets (Таблицы Каскадных Стилей) - это язык, содержащий набор свойств для описания внешнего вида любых HTML документов. С его помощью дизайнер имеет полный контроль над стилем и расположением каждого элемента веб страницы, что проще и гораздо функциональнее использования обычного набора HTML тегов. Приведу пример: Вам нужно создать жирный красный подчеркнутый текст. |
|
|
|
Большинство HTML документов имеют заголовок. Для его создания используют теги , где n – число от 1 до 6. Заключив текст между этими тегами, вы получите заголовок определенного размера... |
|
|
|
Цвет и фон страницы выбираються по желанию дизайнера, но нужно учитывать и тот факт, что от них зависит визуальное восприятие всего сайта. Не стремитесь все затемнить, текст удобно читать, если его хорошо видно... |
|
|
|
Для вставки изображений в HTML документ используется следующая конструкция (представлена полная)... |
|
|
|
Карты - это способ сделать различные части одного графического изображения гиперссылками. Они позволяют выделить отдельные области изображений и определить для каждой из них свое действие... |
|
|
|
Ссылки HTML позволяют связать текст или картинку с другими гипертекстовыми документами. Текст, как правило, выделяется цветом или оформляется подчеркиванием. Вот обычная конструкция ссылки... |
|
|
|
Мета-теги - информация для Обозревателя и поисковых машин. В HTML документе всегда размещаются между тегами . Большинство мета-тегов являются не обязательными, поэтому решайте сами какие использовать. Приведены самые полезные... |
|
|
|
Используя таблицы, можно создавать такие эффекты, как верстка в несколько колонок, применение эффектов состыковки картинки и фона, тонкие линии на всю ширину или высоту странички и т.д. |
|
|
|
Для непронумерованных списков Обозреватель обычно использует маркеры для пометки элемента списка. Вид маркера, как правило, настраивает пользователь Обозревателя... |
|
|
|
Форма — это инструмент, с помощью которого HTML-документ может отправить информацию в заранее определенную точку внешнего мира. Формы применяються для опроса посетителей, покупки чего-либо, отправки електронной почты. |
|
|
 |
 |
 |
 |
|
|