Учебник Информатика. Базовый курс. Симонович С.В.. С. В. Симоновичаинформатикабазовый курс2е издание
 Скачать 17.96 Mb.
|
|
. Гипертекстовые ссылки Гипертекстовая ссылка (рис. 19.2) является фрагментом текста документа и потому задается текстовым элементом, определяемым при помощи парного тега <А>. Этот элемент содержит обязательный атрибут, который не может быть опущен. В дан- ном случае обязательным является атрибут HREF= (знак равенства показывает, что необходимо задать значение этого атрибута). 542 Глава 19. Публикация Web-документов Гипертекстовые Рис. На гипертекстовые ссылки выделяются цветом и подчеркиванием В значения атрибута используется адрес URL документа, на который ука- зывает ссылка. Она может указывать на произвольный документ, располагающийся на любом общедоступном узле сети архив и прочие). Например, открывающий тег ссылки может иметь вид Адрес URL может быть задан в форме, то есть начинаться с указания протокола адреса Web-узла. Такая запись адреса используется, когда необходимо направить посетителя на другой Web-узел, и рассматривается как внешняя ссылка. При использовании относительного адреса в ссылке задается только относитель- ный путь поиска для документа. В этом случае предполагается использование того же протокола и того же а ссылка рассматривается как внутренняя. Внут- ренняя ссылка сохраняет свою работоспособность в случае изменения адреса Web- узла как целого (например, в результате его переноса на другой сервер), поэтому при потенциальной возможности такого события следует отказываться от полного задания адресов в гиперссылках. Гиперссылки можно использовать для ссылки на мультимедийные файлы. Это удобно, так как в этом случае не приходится ждать загрузки мультимедийных фай- лов при работе с данной страницей. Если же требуется интегрирование объектов мультимедиа в Web -страницу, используют парный тег или нестандарт- ный непарный тег который тоже поддерживается наиболее распростра- ненными браузерами. Полный формат гиперссылки включает возможность ссылки на определенное место внутри страницы. Но это можно сделать для страниц собственной разработки, соответствующее место при помощи якоря. Якорь задается также при помощи парного тега <А>, но в роли обязательного выступает атрибут NAME=. Зна- чение этого атрибута последовательность латинских букв и цифр (пробелы недопустимы), рассматриваемая как имя якоря. Для ссылки на якорь его имя указывается в конце адреса URL после символа «#». <А Применение языка HTML 5 4 3 Web-графика Графические иллюстрации в большинстве случаев являются неотъемлемой частью Сегодня графические элементы Wei-страниц используют два основных формата — GIF JPEG (допустим также формат PNG, который, однако, так и не получил широкого распространения). Все графические браузеры, предна- значенные для отображения на экране компьютера, способны распо- знавать и отображать файлы этих форматов. Для подготовки изображений можно использовать любой графический редактор, например стандартное приложение Paint (в которое позволяет сохра- нять файлы в этих форматах. Файлы формата GIF (Graphic Interchange Format) имеют расширение Изобра- жения в этом формате содержат 256 цветов, заданных индексной палитрой. Файл упакован и может занимать значительно меньше места, чем неупакованный раст- ровый рисунок (например, в формате Спецификация формата GIF89a позволяет создавать файлы обладающие спе- циальными • Один из цветов изображения может быть объявлен прозрачным. Это означает, что в соответствующих местах сквозь него будет проглядывать фон Web-стра- ницы, что позволяет задать не только прямоугольную форму рисунка и делает его более естественным. • Чересстрочные изображения при их приеме из Интернета прорисовываются постепенно, вначале грубо, а затем все более и более четко. Это «скрадывает» время, необходимое на их загрузку из Интернета, особенно при приеме инфор- мации по медленным линиям. • GIF-анимация превращает обычный рисунок в небольшой видеоролик. В стан- дартном файле с расширением хранится набор кадров, а также сценарий их отображения. Для создания файлов использующих эти расширенные возможности, необхо- дим графический редактор, более мощный, чем Paint. Для создания GIF- анимации используют специальные средства. Файлы (Joint Photographic Expert Group — названию группы иссле- дователей, предложившей этот формат, читается могут иметь расши- рение JPG. Формат предназначен для хранения фотографических изоб- ражений, использующих 24-разрядный цвет. При в происходит потеря части информации, приводящая к некоторому ухудшению каче- ства изображения, обычно незаметному на глаз. При выборе формата изображения в первую очередь принимают во внимание объем получающегося файла и во — качество изображения. При загрузке Web- документа львиную долю времени занимает именно загрузка иллюстраций, так что любая экономия приветствуется. При выборе формата рекомендуется создать два файла: в формате GIF в JPEG с минимально приемлемым качеством, после чего выбрать вариант, имеющий меньший объем. 5 4 4 Глава } 9. Публикация Рисунки хранятся на Web-узлах в отдельных файлах, но отображаются как эле- менты Web-страниц. Для вставки рисунка используется текстовый элемент, задава- емый непарным Тег должен содержать обязательный атрибут SRC=, задающий адрес URL файла с изображением в относительной или абсолют- ной форме. .gif"> При отображении рисунка браузер по умолчанию использует его реальные размеры. Если рисунок необходимо отмасштабировать, применяют атрибуты WIDTH= и HEIGHT=, задающие ширину и высоту рисунка (в пикселах), соответственно. Если эти параметры заданы, то браузер может определить, какое место надо выделить для отображения рисунка, еще до того, как рисунок загружен. Это несколько ускоряет отображение загружаемой страницы, так что удобно задавать эти атрибуты всегда. Внешний зависит от того, как именно рисунок располагается на ней. Так как рисунок задается как текстовый элемент, находящийся внутри какого-то абзаца, по умолчанию он рассматривается как встроенное изображение, включаемое в строку текста. изображение отображалось автономно, его включают в отдельный абзац. Для изображения, которое действительно включено в строку, можно задать режим взаимодействия с текстом с помощью атрибута ALIGN=. Этот атрибут может принимать три значения: • если задано то нижняя граница изображения совмещается с основанием текстовой строки; • если задано то середина изображения совмещается с середи- ной текстовой строки; • если задано то верхняя граница изображения выравнивается по верхнему обрезу текстовой строки. Однако более предпочтительно использование «плавающего» изображения, обте- каемого текстом, что также достигается использованием атрибута ALIGN=: • если задано ALIGN="LEFT", то изображение размещается у левого края страницы, а последующий текст размещается справа от него; • если задано то изображение размещается у правого края стра- ницы, а последующий текст размещается слева от него. В этом случае рекомендуется помещать тег Однако нормальный режим обтекания требует, чтобы между текстом и изображе- нием оставался некоторый промежуток (рис. 19.3). Задать величину этого проме- жутка можно при помощи атрибутов HSPACE= (по горизонтали) и VSPACE= (по вертикали). Размеры задаются в пикселах. Применение языка HTML 545 19.3. Изображение в тексте, выровненное по левому полю Создавая иллюстрированные страницы, не следует забывать, что не все смогут увидеть эти иллюстрации. Читателей, не имеющих адекватного средства просмотра, можно ознакомить с содержанием иллюстраций при помощи альтернативного текста. Альтернативный текст задается как значение и отображается вместо картинки, если она по каким-то причинам не может быть выведена. Так как изображение задается как текстовый элемент, оно может быть помещено внутрь другого текстового элемента, например задающего гиперссылку (тег <А>). В этом случае изображение становится При отображении документа на экране компьютера такое изображение отличается синей рамкой и изменением формы указателя при наведении. Еще один способ применения изображений на Web-страницах состоит в исполь- зовании их в качестве фонового рисунка. При отображении документа, содержащего фоновый рисунок, на компьютере рабочая область окна заполняется этим рисунком последовательно (как паркетом), считая от верхнего левого угла документа или окна (рис. 19.4). Фоновый рисунок задается с помощью атрибута в теге Значением этого атрибута должен быть абсолютный или относи- тельный адрес для файла с изображением. Форматирование текста Управление форматированием текста не является основной задачей HTML, и поэтому текстовые элементы, выполняющие эту задачу, начиная с версии 4.0 рассматриваются как устаревшие, и их использование не рекомендуется. Однако они все еще предоставляют удобный способ управления видом документа на экране компьютера. 546 Глава Публикация Web-документов 19.4. выбору фонового следует подходить с особой осторожностью, так как неудачный фон может сильно затруднить чтение документа Парный тег позволяет управлять параметрами шрифта. Он должен обяза- тельно содержать хотя бы один из трех атрибутов: FACE= или SlZE=. Атрибут задает цвет текста, который может быть задан текстовым значе- нием (например, или шестнадцатеричным кодом, в котором последовательные байты задают значения красной, зеленой и синей составляю- щих цвета дает тот же результат, что и Атри- бут задает гарнитуру шрифта. Значение этого атрибута сравнивается с име- нами шрифтов, которые установлены на компьютере. Атрибут SIZE= определяет размер шрифта в относительных единицах (от 1 до 7). Для этого атрибута можно определять значение со знаком (плюс или минус), которое определяет увеличение или уменьшение шрифта относительно текущего Параметры шрифта, используемые в документе по умолчанию, задают с помощью непарного тега который помещают один раз внутри элемента BODY. Он может использовать те же атрибуты, что и тег Начертание символов задается при помощи парных тегов <В> (полужирный шрифт), (курсив), (подчеркнутый текст) элементы фразы, описывающие функциональные особенности текста; вместо <В>Обратите лучше написать Так, парный тег предназначен для отображения цитат (выводятся курси- вом). Парные теги (выделение) и (сильное выделение) являются функциональными аналогами курсивного и полужирного начертаний. Кроме того, язык HTML содержит набор элементов для описания работы компьютерных грамм. Для этой цели используют парные теги (исходный текст программы), (текст, вводимый с клавиатуры), (пример вывода программы) и (программные переменные). Для вывода элементов Применение языка HTML 547 используется моноширинный шрифт. Кроме того, переменные выводятся курси- вом, а клавиатурный ввод (в некоторых браузерах) — полужирным шрифтом. Язык HTML поддерживает пять видов списков, из которых два (списки меню и списки каталогов) считаются устаревшими и не рекомендуются к применению. Оставши- еся три типа — упорядоченные списки, неупорядоченные списки и списки опреде- лений. Все списки представляют собой блочные элементы. Упорядоченные (нумерованные) и неупорядоченные (маркированные) списки, примеры которых приведены на рис. оформляются одинаково. Они создаются при помощи парных тегов: для упорядоченного списка и
Закрывающий тег можно опускать, так как его местона- хождение легко восстановить. Открывающие теги могут содержать атрибуты, опре- деляющие вид маркера (для списка), способ и последователь- ность нумерации (для упорядоченного). Разрешается вложение списков друг в Друга. Рис. 19.5. Создание маркированных и нумерованных списков Список определений задается парным тегом
цилиндр или диск, который плотно входит внутрь цилиндра 548 Глава Публикация Web-документов Таблицы Таблицы удобны для представления больших объемов данных, а многие Web-дизай- неры используют их также для точного размещения элементов Web-страниц (рис. 19.6). Таблица в языке HTML задается при помощи парного тега Она может содержать заголовок таблицы, определяемый парным тегом и строки таблицы, задаваемые при помощи парных тегов 19.6. Для размещения текста в двух колонках использована «невидимая» таблица Каждая строка таблицы содержит ячейки таблицы, которые могут относиться двум разным типам. Ячейки в заголовках столбцов и строк задают парным тегом <ТН>, а обычные ячейки — парным тегом . Закрывающие теги и | можно опускать. Например, «пустая» таблица с двумя строками и двумя столбцами может быть задана следующим образом:
|