Вставка графических изображений

 

Добавить на Web-страницу графическое изображение позволяет одинарный тег <IMG>. Web-обозреватель поместит изображение в том месте Web-страницы, в котором встретился тег <IMG>.

В главе 1 мы говорили об атрибутах тегов HTML, после чего надолго о них забыли. Сейчас настала пора о них вспомнить, т. к. сила тега <IMG> — в его атрибутах.

Обязательный атрибут тега SRC служит для указания интернет-адреса файла с изображением.

Пример:

<IMG SRC="image.gif">

Этот тег помещает на Web-страницу изображение, хранящееся в файле image.gif, который находится в той же папке, что и файл самой этой Web-страницы.

Пример:

<IMG SRC="/images/picture.jpg">

Данный тег помещает на Web-страницу изображение, хранящееся в файле picture.jpg, который находится в папке images, вложенной в корневую папку Web- сайта.

Пример:

<IMG SRC="http://www.othersite.ru/book12/author.jpg">

А этот тег помещает на Web-страницу изображение, хранящееся в файле с интернет-адресом http://www.othersite.ru/book12/author.jpg , т. е. изображение с другого Web-сайта.

 

НА ЗАМЕТКУ

Принципы формирования интернет-адресов файлов, применяемые в WWW, мы подробно рассмотрим в главе 6 .

 

Мы уже знаем о том, что элементы Web-страницы могут быть блочными и встроенными. Так вот, изображение, помещенное на Web-страницу с помощью тега <IMG>, — встроенный элемент. Это значит, что он не может "гулять сам по себе", а должен быть частью блочного элемента, например, абзаца.

Из этого следуют два важных вывода.

Во-первых, мы можем вставить графическое изображение прямо в абзац:

<P>Посмотрите картинку — <IMG SRC="image.gif"></P>

Во-вторых, если нам понадобится отобразить на Web-странице отдельное, не связанное ни с каким абзацем графическое изображение, нам придется поместить его в специально созданный абзац:

<P><IMG SRC="/images/picture.jpg"></P>

Настала пора попрактиковаться. Найдем подходящий графический файл и поместим его в папку, где хранятся файлы нашего Web-сайта. Автор выбрал изображение значка @, хранящееся в файле image.gif. Разумеется, вы можете выбрать любой другой файл, но в этом случае не забудьте указать его имя в HTML-коде листинга 4.1.

Впишем в раздел тегов Web-страницы index.htm тег <IMG> и создадим описывающую его Web-страницу. Это будет третья Web-страница нашего Web-сайта.

HTML-код приведен в листинге 4.1.

 








Дата добавления: 2015-05-08; просмотров: 764; ЗАКАЗАТЬ НАПИСАНИЕ РАБОТЫ


Поиск по сайту:

При помощи поиска вы сможете найти нужную вам информацию.

Поделитесь с друзьями:

Если вам перенёс пользу информационный материал, или помог в учебе – поделитесь этим сайтом с друзьями и знакомыми.
helpiks.org - Хелпикс.Орг - 2014-2023 год. Материал сайта представляется для ознакомительного и учебного использования. | Поддержка
Генерация страницы за: 0.003 сек.