Юный техник, 2002 № 07

В прошлый раз мы учились красиво размещать на своей Интернет-страничке текст и заголовки. А сегодня пришел черед иллюстраций, таблиц и того, что отличает Web-страницы от обычных документов, гиперссылок. Эти несколько схем наглядно показывают, как реализовать перечисленные элементы и что получается в результате, а текст HTML-листингов содержит необходимые пояснения.

Рубрику ведет Дмитрий УСЕНКОВ, старший научный сотрудник Института информатизации образования РАО

¹— SRС указывает имя файла рисунка;

² — ALT указывает текст подсказки (в кавычках)

Проще всего вставить маленький рисунок прямо в текст. При этом строки "раздвинутся" по высоте рисунка, так что и текст и рисунок

SRC¹ = rrplan.gif ALT² = "Haш самолет — вперед лети">

будут выровнены по низу. А если надо, чтобы при наведении курсора мышки на рисунок "всплывал" текст небольшой подсказки, надо записать его дополнительно.

* * *

¹ — Тэг заключен в контейнер абзаца (<Р>…, выровненного по центру)

<Р> Рисунок побольше можно вставить как отдельный абзац.

<РALIGN=CENTER¹>

<Р>Тогда его можно выровнять слева, справа или по центру (аналогично тексту), а окружающие абзацы будут располагаться сверху и снизу.

* * *

¹ - Оборка рисунка текстом — рисунок слева, текст — справа

Можно также вставить рисунок в текст так, ¹ ALT="Чтo бы еще такое придумать?"> чтобы текст "обтекал" рисунок справа или слева. Такое размещение иллюстраций называется оборкой рисунка текстом, а положение рисунка относительно текста (слева или справа) указывает параметр выравнивания ALIGN (LEFT или RIGHT).

* * *

¹ — Ссылка, открывающая рисунок;

² — Рисунок, являющийся ссылкой (синяя рамка и курсор мыши — «рука»);

³ — Ссылка на исполняемый файл;

⁴ — Ссылка на указанную страницу данного сайта;

⁵ — Ссылка на другой сайт (указан его адрес — URL);

⁶ — Ссылка на отправку почты (адрес, записанный после «mailto»)

Гиперссылка — это любое слово или фрагмент текста, обычно выделенное синим цветом и подчеркиванием, щелчок на котором мышкой открывает заданную <А HREF«"img2.htm"⁴> другую страницу (в том числе <А НREF=''http://www.chat.ru/">⁵ на другом сайте ) или вызывает <А HREF="mailtо: [email protected]"⁶> отправку письма по электронной почте. Для этого требуемый фрагмент текста заключается в контейнер А, где параметр HREF указывает имя открываемого htm-файла и/или адрес сайта.

Гиперссылкой может быть и рисунок <А HREF="imgl.htm">², если тоже заключить его в контейнер А, такие рисунки-ссылки обычно выделяются синей рамкой. Открывать же по ссылке можно не только Web-страницу, но и <А НREF="Gadqet_hb.jpq"¹ рисунок или даже любой <А НREF="fokus.exe"³> произвольный файл (такая ссылка инициирует загрузку с сервера на компьютер пользователя).

Самый главный признак гиперссылки — что курсор мыши при его наведении на ссылку меняет вид, превращаясь в изображение "руки".

* * *

¹ — Таблица по центру страницы;

² — Первая ячейка второй строки (ширина — 40 % от ширины таблицы) с отцентрированным рисунком;

³ — Вторая ячейка второй строки (ширина — 60 % от ширины таблицы) с отцентрированным текстом.

Таблицы в HTML — это, наверное, одна из самых сложных конструкций.

Вся таблица заключается в контейнер TABLE, внутри него содержится несколько контейнеров TR, соответствующих строкам таблицы, а внутри каждого из них — еще контейнеры ТD, в которых заключено содержимое каждой из ячеек данной строки. И наконец, вся таблица может быть заключена в отдельный контейнер абзаца, чтобы выровнять ее по центру или справа:

¹

 ' Начало таблицы: ширина 80 % от ширины страницы, толщина границы — 2 пикселя

' Первая строка таблицы