Добавление графики на веб-страницу
Практическое занятие № 3
Ссылки и графика в HTML-документе
Цель: научиться устанавливать связи HTML-документа с различными сетевыми ресурсами, оформлять гиперссылки и вставлять графические изображения в HTML-документ.
Методические указания
Работа с графикой
Тег, позволяющий добавить изображение на веб-страницу впервые появился в стандарте HTML 3.2 (от 14 января 1997 года).
Современными веб-браузерами поддерживаются не все существующие графические форматы, поэтому не всякое изображение может быть размещено в рамках веб-страницы.
Различают форматы растровых и векторных изображений. Растровые изображения хранятся в файлах с расширениями jpg, gif, bmp, tiff, png, psd. Векторные – swf, cdr, max, ai ….
Из вышеперечисленных форматов хранения графики, в веб-разработке используются JPEG, PNG и GIF для растровой графики и SWF для векторной. Все три формата для растровой графики используют сжатие графической информации.
Добавление графики на веб-страницу
Структура мультимедийной информации принципиально отличается от структуры текстовой, поэтому напрямую мультимедиа не может быть описана в html -коде. Вся необходимая разработчику мультимедиа содержится в отдельных файлах, ссылки на которые, в виде соответствующих тегов прописываются в html -коде.
Для добавления изображения средствами html используется непарный тег < img >, содержащий обязательный атрибут src, указывающий расположение графического файла для отображения.
К числу необязательных атрибутов < img > относятся:
· align – задает тип выравнивания изображения;
· alt – задает текст, отображаемый в случае, если картинка не загрузилась;
· border – определяет толщину рамки вокруг изображения;
· height – задает высоту изображения;
· hspace – задает величину горизонтального отступа от изображения до ближайшего контента;
· ismap – определяет, является ли изображение картой (т.е. к различным частям изображения "привязаны" разные ссылки);
· vspace – задает величину вертикального отступа от изображения до ближайшего контента;
· width – задает ширину изображения;
· usemap – определяет ссылку на < map >, содержащий координаты клиентской карты - изображения.
< img > является встроенным тегом, т.е. он не может использоваться вне абзаца. Пример:
<p><img src="sample.jpg"></p>
Не нашли, что искали? Воспользуйтесь поиском:
|