3. Вставка объектов, создание ссылок

Вставка в документ объектов

Элемент <IMG>

используется для вставки в тело документа графического изображения. Под графическим изображением подразумевают: маленькие пиктограммы, рисунки, графические объекты и карты изображений, занимающие большую часть окна браузера. Кроме того, элемент <IMG> поддерживает различные атрибуты, определяющие расположение изображения относительно окружающего текста и содержания Web страницы в целом. Изображение может выравниваться по левой, правой, верхней или нижней границе строки или располагаться в центре окна.

Синтаксис: <IMG src= URL атрибуты >

src этот атрибут указывает на файл графики, задавая его URL.

• alt В некоторых случаях, когда браузер не в состоянии загрузить файл с изображением, либо когда пользователь намеренно, с целью сэкономить время и деньги, отключает загрузку картинок, на экране высвечивается альтернативный текст типа здесь нарисован логотип фирмы . Синтаксис: <IMG alt=" описание ">

• align Этот атрибут задает расположение рисунка в окне и его выравнивание.

• height Этот атрибут задает высоту области в пикселях, отводимой в окне под изображение. В этом случае рисунок автоматически масштабируется браузером под заданный размер.

• hspace Этот атрибут задает пустое пространство в пикселях справа и слева от рисунка. Синтаксис: <IMG hspace= число >

• border Этот атрибут задает в пикселях толщину рамки вокруг рисунка. Синтаксис: <IMG border= число >

• vspace Этот атрибут задает пустое пространство в пикселях сверху и снизу от рисунка. Синтаксис: <IMG vspace= число >

Элемент <BANNER>

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

Синтаксис: <BANNER>Текст или рисунок </BANNER>

Элемент <MARQUEE>

используется с целью создания в документе бегущей строки.

<MARQUEE атрибуты> Текст строки </MARQUEE>

Элемент <A>

используется с целью создания ссылок на другие элементы документа, или на другие документы. Элемент выполняет два действия: задает имя ссылки и задает ссылку на имя. Имя ссылки браузер автоматически выделяет другим цветом и подчеркивает. Синтаксис

Произвольный текст <А href="Адрес ссылки"> текст для щелчка </а>

ссылка на рисунок выглядит так:

<А href =" Адрес ссылки"> <IMG src=" Ссылка на рисунок"> </а>

Первый шаблон используется в том случае, когда гиперссылка встречается в тексте. Атрибут href может указывать на ресурс Интернета, файл на локальном диске или на метку внутри текущей страницы. Текст, расположенный внутри элемента А, представляет собой видимую часть гиперссылки. На нем должен щелкнуть пользователь, чтобы осуществить переход. Броузер выделяет этот фрагмент цветом, а после использования гиперссылки меняет цвет, чтобы обеспечить подсказку.

Второй шаблон задается в том случае, когда видимая часть гиперссылки представляет собой рисунок. Если для последнего определена рамка, то она тоже меняет цвет после использования гиперссылки. Если ссылка указывает на рисунок, который находится на локальном диске, она обязательно должна начинаться со слова file , то есть содержать указание на протокол:

h ref=" file: //Диск :\Путь к файлу"

или

href=" file: ///Диск: /Путь к файлу"

По умолчанию используется ссылка на файлы текущей папки (той, где расположен файл Web-страницы). В этом случае просто указывается имя файла, например: page2.html, photo35.jpg.

Часто используются относительные ссылки на папки: это позволяет легко менять местоположение комплекса страниц на диске. Если в текущей папке есть другая, в которой размещены необходимые файлы, ссылка строится по такому шаблону:

href =" . /Папка/Файл.тип"

Здесь на структуру вложенных папок указывает точка перед наклонной чертой. Если необходимо указать папку, которая находится на том же уровне вложения, что и текущая, то добавляют еще одну точку:

href=" , . /Папка/Файл.тип"

Подобно многим другим элементам языка, элемент А требует использования атрибутов.

Атрибуты:

name

Для задания имени используется атрибут name, который задает привязку ссылки в тексте, на которую и будет производиться ссылка. Синтаксис: <A name=имя> необязательный текст </A >

href

Для организации ссылки используется атрибут href, который задает адрес ссылки. Он может указывать или на имя ссылки в тексте, или на URL и имя файла.

Синтаксис: <A href="URL"> текст, для щелчка </A >

или же в тексте: <A href="#имя"> текст для щелчка </a>

id

Для организации ссылки используется атрибут id, который задает адрес ссылки. Атрибут id идентичен атрибуту name с той разницей, что он может вставляться в тэги, отличные от тэга <A>

Например: <P id="имя абзаца"> далее в тексте.. .<A href="# имя абзаца"> Ссылка</A >

title

Для визуализации подсказки ссылки используется атрибут title, который задает название ссылки

Синтаксис: <A title=" имя ссылки"> Ссылка</A >

Пример: ссылка наверх

accesskey

Атрибут используется для указания горячей клавиши, при нажатии на которую осуществляется переход по ссылке Синтаксис: <A accesskey=" имя клавиши"> Ссылка</A >

Пример: ссылка наверх - нажмите ALT+u

Ниже приведен пример использования ссылок и изображений: Файл номер один содержит изображение; текстовую и графическую ссылки на файл номер два. Файл два содержит пример бегущей строки и текстовую ссылку на файл один.

Файл 1:

<HTML>

<HEAD>

<TITLE> Пример номер 4_1 </TITLE>

< /HEAD>

<BODY LEFTMARGIN=50 >

<H1 align=center> Примеры картинки и ссылки </H1>

<BR>

<A HREF="prim4_2.html"> Перейти к файлу 4_2 </A>

<BR>

<IMG SRC="t1.jpg" ALT="Просто Картинка">

<P>Дальше картинка - ссылка</P>

<P><A HREF="prim4_2.html"><IMG SRC="f_ref.GIF"></A></P>

</BODY>

</HTML>

Файл 2:

<HTML>

<HEAD>

<TITLE> Пример номер 4_2 </TITLE>

</HEAD>

<BODY LEFTMARGIN=50 >

<H1 align=center> Примеры бегущей строки и возврата на другую страницу</H1>

<MARQUEE атрибуты> Это бегущая строка</MARQUEE>

<A HREF="prim4_1.html"> Перейти к файлу 4_1</A>

< /BODY>

</HTML>