Графика
Вставка рисунка
IMG – сокращение от «image» (изображение). Для вставки рисунка используется тэг <IMG> с атрибутом SRC= для указания, какую графику загрузить. Изображения можно помещать в любом месте web-страницы: в заголовке, таблице, списке или тексте. При этом тэг <IMG> должен располагаться между тэгами <BODY> и </BODY>.
Например, требуется на пустую страницу графическое изображение из файла face.jpg: <IMG SRC=face.jpg>
Этот тэг сообщает браузеру, что необходимо вывести на экран изображение с именем исходного файла face.jpg. Ввод этого тэга подразумевает, что файл face.jpg находится в той же директории, что и HTML-файл. Если это не так, браузер не сможет найти изображение, на которое идет ссылка. Если же файл находится в другой директории, то необходимо в тэге указать путь к ней, например:
<IMG SRC=C:\images\face.jpg>
Атрибуты WIDTH и HEIGHT определяют ширину и высоту рисунка в пикселях (точках). Если ширина и высота не указаны, загрузка страницы замедляется и часто приводит к некрасивому эффекту «скачущего» текста на экране. Если указанные ширина и высота не соответствуют действительным размерам рисунка, при выводе он будет отмасштабирован, что также существенно замедляет загрузку (единственное допустимое исключение - уменьшение или увеличение при загрузке в 2 раза).
Значение атрибута BORDER также указывается в пикселях и определяет ширину рамки вокруг рисунка, являющегося гиперссылкой. Если рамка не нужна, значением этой опции следует сделать 0, а если рисунок не является ссылкой, опцию можно не указывать.
Опция ALIGN определяет размещение рисунка относительно текста, единственные понимаемые всеми браузерами значения - LEFT (слева) и RIGHT (справа). Опции HSPACE и VSPACE, указываемые в пикселях, определяют размер свободного места вокруг рисунка по горизонтали и вертикали. Рисунок не выглядит сливающимся с текстом при их значениях в пределах 5-15.
Текст, переданный в опции ALT, выводится вместо рисунка, если в браузере отключен вывод рисунков или они не успели загрузиться, а также показывается в качестве подсказки при наведении мышки на рисунок. Обычно этот текст содержит название рисунка.
Например, <img src="http://www.sibstrin.ru/prikl/head.gif" width="267" height="106" align="left" alt="Заставка">
Фон страницы
Одна из интересных возможностей HTML – это задание фона документа. Для этого применяется ключевое слово BGCOLOR. Существует возможность выбора из 16 «именных» цветов, приведенных ранее в разделе «Стилевое оформление текста».
Ключевое слово BGCOLOR является частью стандартного тэга HTML <BODY>, охватывающего большую часть текста web-страницы. Например, если пишется <BODY BGCOLOR=RED>, цвет фона становится красным. Подобным же образом задается любой из 16 цветов.
Фоновые изображения
Помимо стандартных цветов можно создавать и фоновые рисунки, используя в сочетании с тэгом <BODY> ключевое слово BACKGROUND. При правильном применении эта графика дает интересный эффект. Фоновые узоры состоят из крошечных изображений в формате GIF, покрывающих весь фон (это похоже на наклеивание обоев). Текст и изображения, естественно, располагаются поверх фона.
Допустим, требуется разместить фоном файл OBOI.JPG, который выглядит следующим образом:
Для этого пишется тэг:
<BODY BACKGROUND=«OBOI.JPG»>
А сама страница выглядит, как на рис. 52.
Рис. 52. Фоновое изображение web-страницы