Задание 2.2
Продолжить формирование главной страницы (файл main.hlml.). Для позиционирования отдельных частей страницы в окне обозревателя использовать возможности таблицы.
Вставка графических изображений
Существует большое количество графических форматов, в которых сохраняются графические данные. Однако при формировании Web-страниц используются в основном два графических формата: GIF и JPEG. Это обусловлено тем, что эти форматы сохраняют графику в сжатом виде и степень такого сжатия довольно высокая.
Графические данные, сохраняемые в формате GIF, ограничиваются 256 цветами. Поэтому этот формат не совсем подходит для хранения качественных цветных фотографий, а более подходит для хранения штриховых изображений.
Для хранения фотографий обычно используется формат JPEG. Графические данные, сохраняемые в этом формате, могут содержать до 224 цветов.
Рисунки, различные графические изображения, которые размещаются на Web-страницах, всегда хранятся в файлах отдельно от, описывающего эту страницу, HTML-кода. Для того чтобы рисунок появился на Web-странице в окне обозревателя, в соответствующем HTML-документе должен присутствовать автономный тег <IMG>. Формат тега имеет вид:
<IMG SRC=”URL”>
Предположим, требуется вставить в HTML-документ рисунок, сохраняемый в графическом файле с именем photo5.jpg, который хранится в той же папке, что и сам HTML-документ. В этом случае в документе должна присутствовать следующая строка:
<IMG SRC=”photo5.jpg”>
Пример 2.4.
В примере 2.3 при компоновке главной страницы использовался метод позиционирования отдельных фрагментов текста с помощью таблицы. Воспользуемся этим же методом для позиционирования графического изображения. Рисунок с именем logotip.gif, который требуется вставить в левый верхний угол страницы, хранится в той же папке, что и сам HTML-документ.
Для рассматриваемого случая будем использовать таблицу с одной строкой и двумя столбцами. В первую ячейку таблицы поместим рисунок, а во вторую заголовок документа с горизонтальной чертой снизу. Тогда фрагмент текста HTML-документа будет выглядеть так:
<HTML>
<HEAD>
<TITLE> ООО “Гепард” </TITLE >
<TABLE BORDER=1>
<TR>
<TD>
<IMG SRC="logotip.gif">
</TD>
<TD WIDTH=87%>
<H2 ALIGN="center"><I>Фирма “Гепард”</I></H2>
<HR WIDTH=80%>
</TD>
</TR>
</TABLE>
</HEAD>
<BODY>
<BODY>
</HTML>
Результат действия этого HTML-кода показан на рис. 2.4.
Рис. 2.4. Использование таблицы для позиционирования рисунка
Задание 2.3
Используя доступные графические средства, например графический редактор Paint, разработать логотип вашей фирмы. В случае возникших затруднений, найти при помощи поисковых систем Интернета подходящий рисунок, который можно использовать в качестве логотипа вашей фирмы. Сохранить рисунок в виде файла в вашем каталоге.
Поместить логотип вашей фирмы на главную страницу сайта, используя табличный способ позиционирования данного элемента.
Организация гиперссылок
Гипертекстовая ссылка (гиперссылка) состоит из двух частей: указателя и адресной части (URL). Указатель (Anchor) виден на Web-странице. Адресная часть скрыта в документе. Однако именно она сообщает обозревателю о том, к какой Web-странице следует получить доступ.
Формат гиперссылки таков:
<A HREF=”URL”> указатель <A>
Буква A (имя тега) – первая буква слова Anchor – указатель.
Аббревиатура HREF происходит от словосочетания Hypertext REFerence – гипертекстовая ссылка.
В качестве указателя может выступать группа слов, символов или рисунок. Таким образом, указатели можно разделить на два вида – текстовые и графические. Текстовые указатели в окне обозревателя выглядят как подчеркнутое слово или группа слов.
Адресная часть ссылки (URL) – это обычно адрес Web-страницы, которую обозреватель должен загрузить, после щелчка по данной ссылке. Тем не менее, следует различать абсолютные и относительные ссылки. Первоначально, когда загружается главная страница некоторого сайта, используется абсолютная ссылка, например, такая: http://www.firstsite.ru/main.html. При переходе к другим страницам этого же сайта используются уже относительные ссылки. Например, если ссылки имеет вид price.html, то это будет относительная гиперссылка соответствующая следующей абсолютной ссылке: http://www.firstsite.ru/ price.html.
Итак, абсолютной будем называть адресную часть ссылки, которая указывает на конкретный компьютер Сети, каталог и файл. Относительные ссылки обычно указывают на файлы, расположенные на том же компьютере.