В прошлый раз мы учились красиво размещать на своей Интернет-страничке текст и заголовки. А сегодня пришел черед иллюстраций, таблиц и того, что отличает Web-страницы от обычных документов, гиперссылок. Эти несколько схем наглядно показывают, как реализовать перечисленные элементы и что получается в результате, а текст HTML-листингов содержит необходимые пояснения.
Рубрику ведет Дмитрий УСЕНКОВ , старший научный сотрудник Института информатизации образования РАО
1 — SRС указывает имя файла рисунка;
2 — ALT указывает текст подсказки (в кавычках)
Проще всего вставить маленький рисунок прямо в текст. При этом строки "раздвинутся" по высоте рисунка, так что и текст и рисунок
будут выровнены по низу. А если надо, чтобы при наведении курсора мышки на рисунок "всплывал" текст небольшой подсказки, надо записать его дополнительно.
* * *
1 — Тэг заключен в контейнер абзаца (<Р>… , выровненного по центру)
<Р> Рисунок побольше можно вставить как отдельный абзац.
<Р ALIGN=CENTER1>
<Р>Тогда его можно выровнять слева, справа или по центру (аналогично тексту), а окружающие абзацы будут располагаться сверху и снизу.
* * *
1 - Оборка рисунка текстом — рисунок слева, текст — справа
Можно также вставить рисунок в текст так, 
чтобы текст "обтекал" рисунок справа или слева. Такое размещение иллюстраций называется оборкой рисунка текстом, а положение рисунка относительно текста (слева или справа) указывает параметр выравнивания ALIGN (LEFT или RIGHT).
* * *
1 — Ссылка, открывающая рисунок;
2 — Рисунок, являющийся ссылкой (синяя рамка и курсор мыши — «рука»);
3 — Ссылка на исполняемый файл;
4 — Ссылка на указанную страницу данного сайта;
5 — Ссылка на другой сайт (указан его адрес — URL);
6 — Ссылка на отправку почты (адрес, записанный после «mailto»)
Гиперссылка — это любое слово или фрагмент текста, обычно выделенное синим цветом и подчеркиванием, щелчок на котором мышкой открывает заданную <А HREF«"img2.htm"4> другую страницу (в том числе <А НREF=''http://">5 на другом сайте ) или вызывает <А HREF="mailtо: [email protected]"6> отправку письма по электронной почте. Для этого требуемый фрагмент текста заключается в контейнер А, где параметр HREF указывает имя открываемого htm-файла и/или адрес сайта.
Гиперссылкой может быть и рисунок <А HREF="imgl.htm ">
2, если тоже заключить его в контейнер А, такие рисунки-ссылки обычно выделяются синей рамкой. Открывать же по ссылке можно не только Web-страницу, но и <А НREF="Gadqet_hb.jpq"1 рисунок или даже любой <А НREF="fokus.exe"3> произвольный файл (такая ссылка инициирует загрузку с сервера на компьютер пользователя).
Самый главный признак гиперссылки — что курсор мыши при его наведении на ссылку меняет вид, превращаясь в изображение "руки".
* * *
1 — Таблица по центру страницы;
2 — Первая ячейка второй строки (ширина — 40 % от ширины таблицы) с отцентрированным рисунком;
3 — Вторая ячейка второй строки (ширина — 60 % от ширины таблицы) с отцентрированным текстом.
Таблицы в HTML — это, наверное, одна из самых сложных конструкций.
Вся таблица заключается в контейнер TABLE, внутри него содержится несколько контейнеров TR, соответствующих строкам таблицы, а внутри каждого из них — еще контейнеры ТD, в которых заключено содержимое каждой из ячеек данной строки. И наконец, вся таблица может быть заключена в отдельный контейнер абзаца, чтобы выровнять ее по центру или справа:
1
|
колонка <ВR>для рисунков ' Ячейка с отцентрированым текстом
|
колонка <ВR>для подписей ' Ячейка с отцентрированым текстом
|
| 2
|
3
"Pэйнджepnлaн' <ВR>в полете
|
' Конец абзаца, в котором она содержится
А с помощью таблиц с невидимой границей (нулевой толщины, указанной в параметре BORDER) можно произвольно размещать текст и рисунки, верстать текст в несколько колонок и пр.