Иллюстрированный самоучитель по WEB-графике



              

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


Следующий тэг задает обтекание графики из файла logotip.jpg справа (картинка будет находиться слева от текста):

<IMG SRC="logotip.jpg" ALIGN=LEFT>

Если требуется расположить картинку справа от текста, то нужно атрибуту ALIGN присвоить аргумент RIGHT:

<IMG SRC="logotip.jpg" >

Чтобы задать поля вокруг картинки, надо написать тэг вида:

<IMG SRC="logotip.jpg" ALIGN=LEFT HSPACE=20 VSPACE=10>

Здесь числа 20 и 10 определяют размеры полей.

Рассмотрим пример совместного использования графики и текстов. Откройте Блокнот (текстовый редактор Notepad) Windows. Напишите в нем HTML-код с использованием рассмотренных выше тэгов. Ниже приводится программа, выводящая некоторый текст и графику. В качестве графического файла можно использовать любой из имеющихся у вас файлов. Здесь используется файл logotip.gif.

<HTML>

<HEAD> <TITLE> Упражнение 1 </TITLE>

</HEAD>

<BODY BGCOLOR="YELLOW">

<IMG SRC="logotip.gif " ALIGN=LEFT>

<Н1>Текст обтекает графику справа</Н1>

Это - пример совместного использования текста и графики. <BR> Текст программы HTML можно писать в любом текстовом редакторе . При этом используются тэги разметки текста .

<P>

Этот текст выводится с нового абзаца. Чтобы сделать это, мы использовали специальный тэг.

<P>

Попробуйте изменить размеры окна Вашего браузера. Обратите внимание, как изменяется расположение текста.

</BODY> </HTML>

Рис. 657. Текст обтекает картинку справа

Широкие возможности точного позиционирования изображений (как и других элементов) на странице предоставляют таблицы и стили. Эти элементы HTML будут рассмотрены позже. Например, вы можете определить таблицу без видимых рамок, а в ячейках этой таблицы разместить картинки, тексты и другие элементы.




Содержание  Назад  Вперед