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

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

• указывать в ссылке полный путь к файлу, начиная с имени дисковода;
• указывать в ссылке путь по отношению к файлу со ссылкой .

Пример текстовых гиперссылок

туда...

Пример текстовых гиперссылок

и обратно...

Графические объекты

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

-вставка графического объекта

Допускается использование файлов в формате GIF и JPG/JPEG.

заставит браузер отобразить на экране графический файл картинка.gif из текущего каталога. " width="640"

Атрибуты

• Атрибут src = “имя файла.jpg”

При помощи этого тега можно задать имя файла с картинкой.

Команда IMG src=“картинка.gif ” заставит браузер отобразить на экране графический файл картинка.gif из текущего каталога.

Атрибуты

• Для удобства картинку сохраняют в ту же папку, что и HTML-документ, тогда в кавычках указывается только имя картинки, например:

• Тег не требует закрывающего тега.

Cтоит пользователю установить курсор на картинке, как надпись появится в маленьком окошке и сообщит дополнительную информацию. " width="640"

Атрибуты

• Атрибут alt = "текст надписи"

Если браузер не находит картинки в указанном месте на диске, он вместо нее рисует на экране маленький прямоугольник и вписывает в него надпись , которая задана атрибутом alt :

IMG src=monstr.jpg   alt="надпись"

Cтоит пользователю установить курсор на картинке, как надпись появится в маленьком окошке и сообщит дополнительную информацию.

Атрибуты

• Атрибуты width = n и height = m

Эти атрибуты задают ширину и высоту (в пикселях) прямоугольника, в который выводится картинка.

Если атрибуты не заданы, картинка рисуется в естественных размерах.

• Атрибут border = n

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

При отсутствии атрибута, или при значении n=0 рамка не рисуется.

Атрибуты

• Атрибут align

Этот атрибут определяет положение иллюстрации по отношению к соседним элементам документа. Можно использовать следующие значения атрибута:

- картинка будет располагаться слева от текста align="right" - картинка будет располагаться справа от текста align="bottom" - текст будет располагаться внизу картинки (это по умолчанию) align="middle" - текст будет располагаться посередине картинки align="top" - текст будет располагаться вверху картинки " width="640"

Атрибуты

• align="left" - картинка будет располагаться слева от текста
• align="right" - картинка будет располагаться справа от текста
• align="bottom" - текст будет располагаться внизу картинки (это по умолчанию)
• align="middle" - текст будет располагаться посередине картинки
• align="top" - текст будет располагаться вверху картинки

Расстояние между текстом и изображением

Расстояние между текстом и изображением задаётся с помощью параметров vspace и hspace ;

Vspace – расстояние от изображения до текста по вертикали.

Hspace – расстояние от изображения до текста по горизонтали.

Расстояние задаётся в пикселях.

Гиперссылки в виде картинки

Cсылкой может быть и картинка. Принцип ссылки тот же, что и в случае с текстом, только между тегами вставляется не текст, а картинка:

Гиперссылки в виде картинки

Картинка ведет себя так же, как текст. Курсор при попадании на картинку-ссылку меняет свою форму.

Мышиный щелчок по картинке заставляет браузер выполнять переход.

Отличие только в том, что картинка-ссылка не подчеркивается, как текст, и не выделяется цветом, а обрамляется в рамочку.