Команды форматирования абзацев

Как известно, на странице текст размещается в абзацах. Для определения абзаца в HTML используется тег <P> </P>. Он имеет параметр ALIGN, управляющий выравниванием текста параграфа с помощью четырех аргументов: LEFT, RIGHT, CENTER и JUSTIFY:

<P ALIGN=LEFT> — выравнивание текста по левому краю экрана;

<P ALIGN=RIGHT> — выравнивание текста по правому краю экрана;

<P ALIGN=CENTER> — выравнивание текста по центру экрана;

<P ALIGN=JUSTIFY> — полное выравнивание текста по обоим краям экрана.

Для размещения любого объекта по центру строки существует тег <CENTER>. Он вполне применим также и к тексту. Если вам необходимо расположить по центру строки лишь несколько слов или заголовок, тег <CENTER> будет являться более удобным вариантом, чем тег <P ALIGN=CENTER>

<P> и <CENTER> требуют закрывающего тега. В случае, если весь текст, находящийся на странице после открытия одного из этих тегов, должен быть размещен с тем же выравниванием, вы можете их не закрывать. Для удобства форматирования текста на странице существует также тег <BR>, переносящий следующий за ним текст на следующую строку.

Пример:

На странице этот текст <BR> будет располагаться в две строки.

Тег <HR>. В броузере он отображается как горизонтальная линия. Для управления внешним видом отображаемых линий у тега <HR> имеются четыре параметра: SIZE, WIDTH, ALIGN и NOSHADE:

SIZE=N(пикселов)	устанавливает толщину линии;
WIDTH=N(пикселов или процентов)	устанавливает ширину линии. Ширина линии может быть жестко указана в пикселах или в процентах относительно ширины окна броузера;
ALIGN=LEFT (RIGHT или CENTER)	устанавливает выравнивание отображаемой линии относительно окна броузера. При отсутствии параметра ALIGN линия всегда центруется относительно окна броузера;
NOSHADE	отключение трехмерного режима отображения линий. При указании этого параметра линия будет отображаться как простая черная полоса (см. рис. 4).

Главное, что надо запомнить, – в Internet особенную важность приобретают не художественные достоинства картинки, а скорость загрузки. Никто, кроме вас, не станет ждать 5 мин, пока появится ваш шедевр, и пойдет дальше. Так что главное достоинство картинок для Сети — минимальный размер.

Для размещения изображений в WWW в данное время используются два графических формата — GIF и JPEG. Остальные типы графических файлов WWW-броузеры без применения специальных дополнительных программ (plug-in) не поддерживают.

Основное различие между форматами GIF и JPEG состоит в том, что применяются они для хранения разных видов графики. GIF преимущественно используется для сохранения рисованных изображений, векторной графики, картинок без полутонов, градиентов (переходов от цвета к цвету) и большого количества мелких деталей разного цвета, тогда как JPEG — для фотоизображений и полутоновой графики, живописи, градиентов и изображений с множеством мелких разноцветных деталей.

Причина подобной несправедливости кроется в том, что формат GIF позволяет сохранять изображение, содержащее не более 256 цветов. Цвета могут быть любыми и в любой комбинации, но общее их количество ограничено этой цифрой. Поэтому в данном формате удобно хранить изображения с небольшим количеством цветов (меньше 256), т. к. это позволяет за счет сокращения объема информации о цветах значительно уменьшить размер файла, а следовательно, и время загрузки. Помимо того, формат GIF используется для сохранения анимированных картинок и изображений с прозрачными частями — в JPEG такие возможности просто не заложены.

Область же применения формата JPEG определяется тем, что он сохраняет полную цветовую палитру 24-битного изображения (True Color), которая может содержать миллионы цветов. При таком объеме информации размер файла получается очень большим, но главной особенностью формата JPEG является его способность хранить изображение в сжатом, как бы заархивированном виде. Степень архивации изображения, сохраненного в формате JPEG, может быть очень большой: нормальным считается сжатие картинки в 10–20 раз без видимой потери качества.

Для размещения картинок на Web-страницах существует специальный тег <IMG>, имеющий обязательный параметр SRC="URL" (источник=путь к файлу) и несколько необязательных. Рассмотрим этот тег поподробнее.

<IMG SRC="logo.gif" BORDER=0 HEIGHT=120 WIDTH=160 ALIGN=LEFT HSPACE=10 VSPACE=10 ALT="Логотип">

SRC="URL" – путь к файлу изображения. Если файл находится на сервере в том же каталоге, что и документ, из которого к нему обращаются, то путь к нему указывать не нужно — требуется указать только имя файла (сохраняя регистр букв). Если файл изображения находится на том же сервере, но в другом каталоге, требуется указать путь к файлу от каталога, где находится документ, из которого к нему обращаются.

Пример: допустим, файл изображения logo.gif находится в каталоге PICTURES, вложенном в основной каталог сайта. Путь к нему будет выглядеть так:

SRC="pictures/logo.gif"

Если файл с изображением находится на другом сервере, необходимо указать полный путь к файлу:

<IMG SRC="http://www.image.com/images/logo.gif">

Необязательные параметры

BORDER=pixels – параметр, указывающий, рамку какой ширины (в пикселах) следует генерировать вокруг изображения. В большинстве случаев рамка не требуется; чтобы она не отображалась, укажите значение параметра BORDER равным нулю.

HEIGHT=pixels и WIDTH=pixels – значения этих параметров указывают броузеру размеры изображения (в пикселах), чтобы при загрузке страницы броузер мог не дожидаться, пока загрузится все изображение, а оставить для него необходимое место и сначала загрузить текст страницы. Текст всегда загружается быстрее, чем графика. Настоятельно рекомендуем вам всегда указывать эти параметры.

ALIGN=TOP, MIDDLE, BOTTOM, LEFT, RIGHT. Параметр ALIGN управляет выравниванием изображения на странице. Значения LEFT и RIGHT ведают размещением картинки с выравниванием относительно левого или правого края страницы. Для размещения изображения по центру страницы используйте тег <CENTER>, например:

<CENTER><IMG SRC="logo.gi" BORDER=0 WIDTH=100 HEIGHT=30></CENTER>

Значения BOTTOM, LEFT, RIGHT управляют выравниванием изображения по вертикали относительно текста, стоящего перед ним.

ВОТТОМ — выравнивание текста по нижнему краю.

МIDDLE — по центру.

TOP — выравнивание по верхнему краю изображения.

При указании двух значений выравнивания значения LEFT и RIGHT выравнивают изображение относительно левого или правого края текста, а не относительно края страницы. В этом случае параметр ALIGN указывается дважды, например:

Этот текст будет находиться слева от изображения, с выравниванием относительно его центра <IMG SRC="logo.gif" ALIGN=MIDDLE ALIGN=RIGHT BORDER=0 WIDTH=100 HEIGHT=30>

Параметры VSPACE и HSPACE указывают количество свободного пространства (в пикселах) по вертикали и горизонтали, которое будет оставлено вокруг изображения при генерации страницы.

HSPACE — отступ слева и справа от картинки.

VSPACE — отступ сверху и снизу.

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

Для того чтобы объединить несколько страниц в один сайт, необходимо связать их гиперссылками. Это основной принцип построения WWW. Гиперссылка может быть присвоена любому элементу, расположенному на странице. Для организации гиперссылки существует специальный тег <A>. Между открывающим и закрывающим тегами может находиться текст или изображение — именно этот элемент и будет объектом, с которого производится гиперссылка.

Он состоит из имени тега <A>, обязательного параметра HREF="URL" и необязательного параметра TARGET.

Параметр HREF="URL" является основной частью тега <А> и указывает, на какой документ ссылается данный элемент страницы. Гиперссылка может указывать на любой документ, который существует в виде файла,— на другую страничку, изображение, файл программы, мультимедиа-объекты и т. д.

Правила указания URL для тега <A> такие же, как и для параметра SRC тега <IMG>, т. е. если документ, на который ссылается данный элемент страницы, находится в том же каталоге сервера, то указывается только имя файла. Если же этот документ находится на другом сервере, требуется указать полный URL.

Параметр TARGET является необязательным и требуется только для того, чтобы определить, в каком окне должен открываться документ, на который организована гиперссылка. Если параметр TARGET не указан, новый документ будет открыт в том же окне. Если указать параметр TARGET c зарезервированным именем "_blank", документ, на который указывает гиперссылка, будет открыт в новом окне.

Примеры использования тега <A>:

Мой любимый журнал <A HREF="http://www.submarine.ru" TARGET="_blank">Подводная лодка</A>

Выглядеть это будет так:

Мой любимый журнал Подводная лодка

Другой пример:

Щелкните <A HREF="http://www.submarine.ru" TARGET="_blank">сюда</A> чтобы прочитать мой любимый журнал "Подводная лодка".

Выглядеть это будет так:

Щелкните сюда чтобы прочитать мой любимый журнал "Подводная лодка".

Для организации гиперссылки с изображения между открывающим и закрывающим тегами <A> вставляется тег <IMG>, указывающий на картинку.

Пример:

<CENTER> <A HREF="http://www.submarine.ru" TARGET="_blank"> <IMG SRC="submarine.gif" WIDTH=130 HEIGHT=98 ALT="Логотип Подводной Лодки" BORDER=0></A> <BR>Мой любимый журнал. </CENTER>