Photoshop 7 и webдизайн

       

Пример отображения webстраницы браузером



Рисунок 16.1. Пример отображения web-страницы браузером


Для тега <BODY> вы можете определить некоторые параметры, например цвет текста и фона, текстуру, ширину полей. Ниже приведен список параметров и их допустимых значений.

  • BGCOLOR задает цвет фона страницы. Записывается в следующем виде: BGCOLOR-#RRGGBB, где RR, GG и ВВ — запись RGB-компонентов цвета в шестнадцатеричной форме. Символ «#» (номер) указывает на то, что дальше записано обозначение цвета. Пример записи:

    <BODY BGCOLOR=#F8FF10>

  • TEXT задает цвет, которым будет отображаться текст документа. Цвет записывается в той же форме, что и цвет фона. Эти настройки могут не сказаться на цвете текста, расположенного в ячейках таблиц. Пример:

    <BODY TEXT="#FF8000">

  • LINK указывает цвет, которым будут отображаться не просмотренные ссылки. Пример:

    <BODY LINK="#12E6F7">



  • VLINK указывает цвет, которым будут отображаться просмотренные ссылки. Пример:

    <BODY LINK="#12E6F7">

  • ALINK указывает цвет, которым будут отображаться активные ссылки (ссылки, по которым в данный момент осуществляется переход). Пример:

    <BODY LINK="#12E6F7">

  • BACKGROUND задает URL-адрес (путь к файлу) фонового рисунка для страницы (текстуры). Этот параметр, а также другие параметры управления цветом и фоном, можно использовать и для задания вида ячеек таблиц. Для этого примените его к тегу <TD>. Подробнее задание таблиц рассматривается в следующем уроке. Пример использования параметра BACKGROUND:

    <BODY BACKGROUND="back/texture.gif">

Примечание 3
Примечание 3

Используя каскадные таблицы стилей (CSS), можно задать фоновое изображение, повторяющееся только по вертикали или только по горизонтали. Также можно поместить фоновое изображение, например, в нужную точку экрана.

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

Среди служебной информации, задаваемой в заголовке документа, вы можете определить такие полезные сведения, как таблица кодировки. Это особенно важно при просмотре документа на компьютере, работающем под управлением другой операционной системы. Если не указать, на каком языке написан документ (точнее, национальные символы какого языка при этом использованы), то браузер будет пытаться отобразить документ с использованием таблицы кодов, применяемой по умолчанию. При этом документ может оказаться нечитаемым. Поэтому надо задать таблицу кодировки вручную, что и делается при помощи тега <МЕТА>. Этот тег размещается в заголовке документа (между тегами <HEAD> и </HEAD>), используется для записи различных данных, указываемых в его параметрах. Закрывающего тега не требуется.

Кодировка, которую необходимо указать, зависит от того, в какой операционной системе и каком редакторе создается файл. Если вы используете систему Windows и Блокнот в качестве HTML-редактора, то для корректного воспроизведения русского текста вам понадобится указать кодовую таблицу Windows-1251, используемую для передачи символов русского языка. При этом тег <МЕТА> следует записать следующим образом:

<МЕТА HTTP-EQUIV="Content-type"
CONTENT="text/html; charset=Windows-1251">

После того, как вы определите структуру документа, можно приступать к наполнению его информацией, предназначенной пользователям. Эта информация располагается между тегами <BODY> и </BODY>. Вы можете поместить в документ текст, «сдобренный» при помощи тегов рисунками и элементами форматирования (заголовками, таблицами, списками). Ниже процесс размещения этих элементов на web-странице рассматривается подробно.

Перед тем как перейти к рассмотрению правил описания информационного содержания страницы, стоит упомянуть об еще одной возможности HTML. Если вы хотите поместить в текст страницы какие-либо замечания, не видимые для простого пользователя, или, если вам надо временно отключить отображение какого-нибудь элемента, вы можете объявить нужный участок текста комментарием. Комментарий, присутствующий в HTML-коде, не влияет на отображение страницы браузером.

Объявить блок текста комментарием можно при помощи специального тега «<!- -». Конец комментария обозначается тегом «- ->». Ниже приведен пример записи текста с комментариями.

Этот текст будет выведен на экран...
<!-- А этот текст не будет отображен браузером -->

Примечание 4
Примечание 4

Хотя текст комментария не отображается в окне браузера, он все равно загружается на компьютер пользователя вместе с остальным содержимым страницы. Поэтому не стоит хранить в виде комментариев информацию, представляющую некоторую тайну (например, имена пользователей и пароли доступа).

Часто возникает необходимость поместить на страницу заголовок раздела или название страницы в целом. Для этого можно использовать стандартные теги заголовка. Язык HTML позволяет задавать заголовки шести размеров (уровней), для которых используются теги от <Н1> до <Н6>. Текст заголовка пишется между открывающим и закрывающим тегами.

<Н1>Это заголовок первого уровня</Н1>
<Н6>Заголовок шестого уровня< /Н6>

Чем больше число, идущее за символом «Н», чем меньше размер текста заголовка. Поэтому, если вы хотите, чтобы заголовок был написан более мелкими буквами, используйте, скажем, тег <Н2> или <Н5>. Наличие заголовка подразумевает автоматическое прерывание строки (подробнее об этом рассказывается далее); кроме того, заголовок может занимать сразу несколько строк. Имейте в виду, что мелкие заголовки — они маркируются тегами <НЗ> и ниже — в большинстве web-браузеров отображаются очень мелким шрифтом, и в результате заголовок может оказаться мельче основного текста. На Рисунок 16.2 показаны примеры заголовков всех шести уровней (для сравнения приведена фраза без дополнительного форматирования).

Существует возможность центрирования заголовков: для этого вместе с тегом используется дополнительный параметр. Чтобы выровнять заголовок по центру, используйте тег со следующим параметром:

<Н1 ALIGN = "CENTER">Это заголовок первого уровня,
выровненный по центру</Н1>

Используя для параметра ALIGN значения left и right, вы можете выравнивать заголовки по правому и левому краям страницы.

Совет 1
Совет 1

Для выравнивания текста и других объектов, включенных в документ, по центру экрана можно использовать специальный тег <CENTER> следующим образом: <CENTER><H1>ЭTO заголовок первого уровня</Н1></СЕNTER>



Содержание раздела