Мы поможем в написании ваших работ!



ЗНАЕТЕ ЛИ ВЫ?

Список сотрудников нашей фирмы

Поиск

ТАБЛИЦА ТЭГОВ HTML

Структурные тэги | Текстовые тэги | Тэги списка | Тэги таблиц | Другие тэги

Название тэга Атрибуты Краткое описание

СТРУКТУРНЫЕ ТЭГИ

<html>...</html>   Помещенный в начало и конец документа, этот тэг сообщает броузеру, что документ составлен в HTML.
<head>...</head>   Определяет заглавную часть документа, содержащую информацию о документе. Тэг не имеет атрибутов и служит только как контейнер для других тэгов заголовка, таких как <title>, <base>, <meta>.
<title>...</title>   Определяет название документа. Название обычно появляется в заглавной части окна браузера.
<base> href = url - определяет базовый URL Определяет базовый URL для всех относительных URL'ей в документе.
<meta> content=text - Определяет значение тэга. http-equiv=text - Определяет информацию, которая будет включена в заголовок HTTP, добавляемый сервером к конец документа. name=text - Определяет имя мета-информации. scheme=text - Обеспечивает дополнительную информацию для интерпритации метаданных Обеспечивает дополнительную информацию о документе. Обычно используется для улучшения возможности поиска документа, а также может использоваться при выполнении элементарных функций.
<body>...</body> alink=#rrggbb - Определяет цвет активных ссылок шестнадцатиричным RGB background=url - предоставляет URL к графическому файлу, который используется как изображение для "укладки черепицей", то есть из отдельных фрагментов, заднего фона документа. bgcolor=#rrggbb - устанавливает цвет фона для документа. link=#rrggbb - устанавливает цвет для всех ссылок в документе. text=#rrggbb - устанавливает цвет для всего текста в документе. vlink=#rrggbb - устанавливает цвет посещенных ссылок для документа. Определяет начало и конец тела документа. Атрибуты тэга затрагивают весь документ.

ТЕКСТОВЫЕ ТЭГИ

<p>...</p> align=center|left|right - Выравнивает текст в пределах тэга влево, вправо или по центру страницы. Обозначает начало и конец параграфа.
<h1>...</h1>... <h6>...</h6> align=center|left|right - Выравнивает текст в пределах тэга влево, вправо или по центру страницы. Определяет вкюченный текст как заголовок. Имеются шесть разлиных уровней величины заголовков, от <h1> до <h6>. С каждым последуюющим уровнем текст отображется с меньшим размером.
<blockquote>... </blockquote>   Идентифицирует включенный текст как цитату. Цитаты в основном отображаются с отступом влево или вправо, и при этом добавляются пробелы выше и ниже абзаца.
<q>...</q>   Выделяет короткие цитаты, которые могут быть включены в строку.
<address>... </address>   Обозначает право собственности на информацию или ее авторство, обычно в начале или в конце документа. Адреса в основном выделяются курсивом с линией разрыва, но без пробелов выше и ниже.
<pre>...</pre> width=number - Этот необязательный атрибут определяет, сколько символов вмещает ширина одиночной строки в пределах блока <pre>. Тэг авторского форматирования. Выделяет предварительно отформатированный и размеченный текст, то есть - строки отображаются точно так же, как напечатаны, и при этом сохраняются множественные пробелы и переводы строк.
<b>...</b>   Включенный текст выделяется жирным шрифтом.
<i>...</i>   Включенный текст выделяется курсивом.
<tt>...</tt>   Форматирует включенный текст как текст пишущей машинки. Текст будет отображен шрифтом фиксированной ширины.
<font>...</font> color=#rrggbb - Определяет цвет, используя шестнадцатиричное RGB значение face=typeface - Определяет шрифт для текста. size=1..7 - Устанавливает размер шрифта по абсолютному значению в масштабе от 1 до 7 (3 - значение по умолчанию). Используется, чтобы воздействовать на стиль (цвет, шрифт и размер) включенного текста.
<br>   Разбивает текст и начинает новую строку, но не добавляет дополнительного места, как это делает тэг <p>.
<hr> align = center|left|right - если разделитель короче, чем ширина окна, то этот тэг управляет горизонтальным выравниваением разделителя. По умолчанию - center. noshade - Отображает разделитель без "тени". size=namber - определяет толщину разделителя в пикселах width=number - определяет длину разделителя в пиксела или процентах от ширины страницы. Добавляет горизонтальный разделитель на страницу.

ТЭГИ СПИСКА

<ol>...</ol> compact - отображает список как можно меньшего размера. start=number - начинает нумерацию списка с указанного номера. type=1|A|a|I|i - определяет систему нумерации: 1 - арабские цифры; А - прописные буквы; а - строчные буквы; I - прописные римские цифры; i - строчные римские цифры. Определяет начало и конец пронумерованного списка, который состоит из пунктов списка <li>.
<ul>...</ul> compact - отображает список как можно меньшего размера. type=disc|circle|square - определяет форму маркеров, используемых для каждого пункта списка. Определяет начало и конец непронумерованного списка, который состоит из пунктов списка <li>.
<li>...</li>   Определяет пункт в пронумерованном или непронумерованном списке.
<li>...</li>   Определяет пункт в пронумерованном или непронумерованном списке.
<dl>...</dl> compact - делает список как можно меньше. Указывает список определения, состоящий из термов (<dt>) и определений (<dd>).
<dt>...</dt>   Используется в пределах списка определени. Этот тэг обозначает часть терма элемента. Заключительный тэг может иногда опускаться.
<dd>...</dd>   Используется в пределах списка определени. Этот тэг обозначает часть определения элемента. Заключительный тэг может иногда опускаться.

ТЭГИ ТАБЛИЦ

<table>...</table> align=left|right|center - Выравнивает таблицу в пределах текстового потока background=url - определяет URL графического рисунка, который используется в качестве фрагмента при заполнении заднего фона таблицы. bgcolor=#rrggbb - определяет цвет фона для всей таблицы. border=number - определяет ширину (в пикселах) границы вокруг таблицы и ее ячеек. cellpadding=number - определяет пространство внутри ячейки (в пикселах), между границей и содержанием ячейки. cellspacing=number - определяет пространство (в пикселах) между ячейками таблицы. height=number - определяет высоту полной таблицы (в пикселах или процентах). hspace=number - содержит размер свободного пространства в пикселах слева и справа от таблицы. vspace=number - содержит размер свободного пространства в пикселах выше и ниже выровненной таблицы. width=number - определяет ширину таблицы в пикселах или процентах. Определяет начало и конец таблицы.
<td>...</td> align=left|right|center - Выравнивает таблицу в пределах текстового потока background=url - определяет URL графического рисунка, который используется в качестве фрагмента при заполнении заднего фона таблицы. bgcolor=#rrggbb - определяет цвет фона для всей таблицы. border=number - определяет ширину (в пикселах) границы вокруг таблицы и ее ячеек. colspan=number - определяет число столбцов, которые текущая ячейка может охватить. height=number - определяет высоту полной таблицы (в пикселах или процентах). nowrap - отключает автоматический перенос текста для текущей ячейки. rowspan=number - определяет число строк, заполненных ячейкой. valing=top|middle|bottom|baseline - определяет вертикальное выравнивание текста в пределах ячейки. width=number - определяет ширину таблицы в пикселах или процентах. В пределах таблицы определяет ячейку данных. Ячейка таблицы может вмещать любое содержимое, включая другую таблицу.
<tr>...</tr> align=left|right|center - Выравнивает таблицу в пределах текстового потока bgcolor=#rrggbb - определяет цвет фона для всей таблицы. valing=top|middle|bottom|baseline - определяет вертикальное выравнивание текста в пределах ячейки. В пределах таблицы определяет строку ячеек.
<thead>...</thead> align=left|right|center|justify|char - Определяет горизонтальное выравнивание. valing=top|middle|bottom|baseline - определяет вертикальное выравнивание. Определяет заглавную часть таблицы и должен содержать информацию о таблице.
<caption>...</caption> align=left|right|center|top|bottom - Определяет горизонтальное выравнивание. valing=top|bottom - определяет вертикальное выравнивание. Обеспечивает краткое описание содержания таблицы.

ДРУГИЕ ТЭГИ

<a>...</a> href=url - определяет URL целевого назначения. Определяет ссылку в пределах документа. Ссылка используется для связи с другим документом и может служить для маркировки фрагмента документа (именованная ссылка).
<img> align=type - Определяет выравнивание изображения alt=text - обеспечивает строку альтернативного текста, которая появляется, когда изображение не отображено. border=number - Определяет ширину границы (в пикселах). height=number - определяет высоту изображения в пикселах. hspace=number - определяет количество свободного места слева и справа от изображения. src=url - указывает URL графического файла, который будет отображен. vspace=number - определяет количество свободного места сверху и снизу. width=number - определяет ширину изображения. Размещает графическое изображение на странице.

На начало

Тэги списков

Существует три основных вида списков в HTML-документе:

  • пронуменрованный
  • непронуменрованный
  • список описаний

Вы можете создавать вложенные списки, используя различные тэги списков или повторяя одни внутри других. Для этого просто необходимо разместить одну пару тэгов (стартовый и завершающий) внутри другой. Будут ли элементы вложенного списка иметь те же маркеры, обозначающие элемент списка - зависит от броузера. Более подробно смотри в разделе "Вложенные списки".

Пронумерованные списки

В пронумерованном списке броузер автоматически вставляет номера элементов по порядку. Это означает, что если вы удалите один или несколько элементов пронумерованного списка, то остальные номера автоматически будут пересчитаны.

Пронумерованный список начинается стартовым тэгом <OL> и завершается тэгом </OL>. Каждый элемент списка начинается с тэга <LI>. Например:

<OL>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</OL>

  1. Программирование
  2. Алгоритмизация
  3. Проектирование

Тэг <OL> может иметь параметры:

< OL TYPE=A|a|I|i|1 START=n>

где:

TYPE

Вид счетчика:

    • A - большие латинские буквы (A,B,C...)
    • a - маленькие латинские буквы (a,b,c...)
    • I - большие римские цифры (I,II,III...)
    • i - маленькие римские цифры (i,ii,iii...)
    • 1 - обычные цифры (1,2,3...)

START=n

Число, с которого начинается отсчет

Например:

<OL TYPE=I START=15>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</OL>

  1. Программирование
  2. Алгоритмизация
  3. Проектирование

Непронумерованные списки.

Для непронумерованных списков броузер обычно использует маркеры для пометки элемента списка. Вид маркера, как правило, настраивает пользователь броузера.

Пронумерованный список начинается стартовым тэгом <UL> и завершается тэгом </UL>. Каждый элемент списка начинается с тэга <LI>. Например:

<UL>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</UL>

  • Программирование
  • Алгоритмизация
  • Проектирование

Тэг <UL> может иметь параметр:

< UL TYPE=disc|circle|square>

Тип тэга <UL> определяет внешний вид маркера как вид по умолчанию (disc), круглый (circle) или квадратный (square). Например:

<UL TYPE=square>
<LI> Программирование
<LI> Алгоритмизация
<LI> Проектирование
</UL>

  • Программирование
  • Алгоритмизация
  • Проектирование

Вложенные списки

Дадим пример вложенных списков:

<HTML>
<HEAD>
<TITLE> Список сотрудников </TITLE>
</HEAD>
<BODY>
<H2> Список сотрудников нашей фирмы </H2>
<H3> Составлено: 30 июля 1996 года </H3>
Данный список содержит фамилии, имена и отчества всех сотрудников нашей компании. <P>
Список может быть использован только в служебных целях. <P>
<OL>
<LI> Дирекция
<UL>
<LI> Иванов И.И.
<LI> Петров К.В.
</UL>
<LI> Отдел маркетинга
<UL>
<LI> Варшавская Е.Л.
<LI> Самсонов Д.М.
</UL>
</OL>
</BODY>
</HTML>

Вот, что вы увидите на экране броузера:

TYPE

Вид маркера (см. <UL>) или счетчика (см.OL)

VALUE=n

Значение для элемента пронумерованного списка (его номер). Все дальнейшие номера элементов списка будут отсчитываться от этого номера.

Например:

<OL TYPE=I START=15>
<LI> Программирование
<LI TYPE=i VALUE=25> Алгоритмизация
<LI> Проектирование
</OL>

  1. Программирование
  2. Алгоритмизация
  3. Проектирование

Список определений

Список определений начинается с тэга <DL> и завершается тэгом </DL>. Данный список служит для создание списков типа "термин"-"описание". Каждый термин начинается тэгом <DT>, а описание - тэгом <DD>. Например:

<DL>
<DT> <B> Отдел маркетинга </B>
<DD> Данный отдел занимается продвижением продуктов и услуг
<DT> <B> Финансовый отдел </B>
<DD> Данный отдел занимается всеми финансовыми операциями
<DT> <B> Отдел кадров </B>
<DD> Данный отдел занимается учетом и набором новых сотрудников фирмы, распределением отпусков, отслеживанием больничных листов и т.д.
</DL>

Отдел маркетинга

Данный отдел занимается продвижением продуктов и услуг

Финансовый отдел

Данный отдел занимается всеми финансовыми операциями

Отдел кадров

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

Гипертекстовые ссылки

Гипертекстовые ссылки являются ключевым компонентом, делающим WEB привлекательным для пользователей. Добавляя гипертекстовые ссылки (далее - ссылки), вы делаете набор документов связанным и структурированным, что позволяет пользователю получать необходимую ему информацию максимально быстро и удобно.

Ссылки имеют стандартный формат, что позволяет броузеру интерпретировать их и выполнять необходимые функции (вызывать методы) в зависимости от типа ссылки. Ссылки могут указывать на другой документ, специальное место данного документа или выполнять другие функции, например запрашивать файл по FTP-протоколу для отображения его броузером. URL может указывать на специальное место по абсолютному пути доступа, или указывать на документ в текущем пути доступа, что часто используется при организации больших структурированных WEB-сайтов.

Внимание! Вы можете использовать ссылки как для перемещения по документу, так и для перемещения от одного документа к другому. Однако, HTML не поддерживает возврат на предыдущую ссылку, если перемещение происходило внутри документа. Если вы используете ссылки внутри документа, а затем нажимаете на клавишу Back, то вы не перейдете на предыдущую ссылку, а вернетесь на ту часть документа, которую вы просматривали до этого.

URL

HTML использует URL (Uniform Resource Locator) для представления гипертекстовых ссылок и ссылок на сетевые сервисы внутри HTML-документа. Первая часть URL (до двоеточия) описывает метод доступа или сетевой сервис. Другая часть URL (после двоеточия) интерпретируется в зависимости от метода доступа. Обычно, два прямых слэша после двоеточия обозначают имя машины:

method :// machine-name /path/foo.html

Следующий пример представляет собой вызов HTML-документа index.html с сервера www.softexpress.com с использованием HTTP протокола:

http://www.softexpress.com/index.html

Uniform Resource Locator имеет следующий формат:

METHOD

Имя операции, которая будет выполняться при интерпретации данного URL. Наиболее часто используемые методы:

file:

чтение файла с локального диска. Имя файла интерпретируется для локальной машины пользователя. Данный метод используется для отображения какого-либо файла, находящегося на машине пользователя. Например:
file:/home/alex/index.html - отобажает файл index.html из каталога /home/alex на пользовательской машине

http:

доступ к WEB-странице в сети с использованием HTTP-протокола. (Это наиболее часто используемый метод доступа к какому-либо HTML-документу в сети). Например:
http://www.softexpress.com/ - доступ к Home-странице компании SoftExpress

ftp:

запрос файла с анонимного FTP-сервера. Например:
ftp://hostname/directory/filename

mailto:

активизирует почтовую сессию с указанным пользователем и хостом. Например:
mailto:info@softexpress.com - активизирует сессию посылки сообщения пользователю info на машине softexpress.com, если броузер поддерживает запуск электронной почты. Заметьте, что метод mailto: не требует указание слэшей после двоеточия (как правило, после двоеточия сразу идет электронный адрес абонента)

telnet:

обращение к службе telnet

news:

вызов службы новостей, если броузер ее поддерживает. Например:
news:relcom.www.support

SERVERNAME

Необязательный параметр, описывающий полное сетевое имя машины. Например:

www.softexpress.com - полное сетевое имя сервера фирмы СофтСервис.

Если имя сервера не указано, то ссылка считается локальной, и полный путь, указанный далее в URL вычисляется на той машине, с которой взят HTML-документ, содержащий данную ссылку. Вместо символьного имени машины может быть использован IP-адрес, однако это не рекомендуется из-за возможного пересечения с фиксированными локальными адресами внутренней сети.

PORT

Номер порта TCP на котором функционирует WEB-сервер. Если порт не указан, то "по умолчанию" используется порт 80. Данный параметр (port) не используется в подавляющем большинстве URL.

PATHNAME

Частичный или полный путь к документу, который должен вызваться в результате интерпретации URL. Различные WEB-сервера сконфигурированы по разному для интерпретации пути доступа к документу. Например, при использовании CGI скриптов (исполняемых программ), они обычно собираются в одном или нескольких выделенных каталогах, путь к которым записан в специальных параметрах WEB-сервера. Для данных каталогов WEB-сервером выделяется специальный логический путь, который и используется в URL. Если WEB-сервер видит данный путь, то запрашиваемый файл интерпретируется как исполняемый модуль. В противном случае, запрашиваемый файл интерпретируется просто как файл данных, даже если он является исполняемым модулем. Например:

http://www.softexpress.com/cgi-win/handle.exe

В данном примере HTTP-сервер должен вызвать CGI-скрипт с именем handle.exe, который находится на машине с сетевым именем www.softexpress.com. Путь к данному скрипту - /cgi-win/ - в действительности является виртуальным путем (выделенным сервером для исполняемых модулей). Заметьте, что при описании пути используется UNIX-подобный синтаксис, где, в отличии от DOS и Windows используются прямые слэши вместо обратных. Если после сетевого имени машины сразу идет имя документа, то он должен находиться в корневом каталоге на удаленной машине или (что чаще) в каталоге, выделенном WEB-сервером в качестве корневого. Если же URL закагчивается сетевым именем машины, то в качестве документа запрашивается документ из корневого каталога удаленной машины с именем, установленным в настройках WEB-сервера (как правило, это index.html).

#ANCHOR

Данный элемент является ссылкой на строку (точку) внутри HTML-документа. Большинство броузеров, встречая после имени документа данный элемент, размещают документ на экране таким образом, что указанная строка документа помещается в верхнюю строку рабочего окна броузера. Точки, на которые ссылается #anchor, указываются в документе при помощи тэга NAME, как это будет описано далее.

Структура ссылок в HTML-документе

Пока что мы рассмотрели только внешний вид URL. Для того, чтобы броузер отобразил ссылку на URL, необходимо отчетить URL специальными тэгами в HTML-документе. Синтаксис HTML, позволяющий жто сделать - следующий:

<A HREF=" URL "> текст-который-будет-подсвечен-как-ссылка </A>

Тэг <A HREF=" URL "> открывает описание ссылки, а тэг </A> - закрывает его. Любой текст, находящийся между данными двумя тэгами подсвечивается специальным образом Web-броузером. Обычно этот текст отображается подчеркнутым и выделенным синим (или другим заданным пользователем) цветом. Текст, обозначающий URL, не отображается броузером, а используется только для выполнения предписанных им действий при активизации ссылки (обычно при щелчке мыши на подсвеченном или подчеркнутом тексте). Вот пример сегмента HTML-документа:

Для получения примера смотри
<A HREF="http:/www.ruswebmasters.com/index.htm> страницу </A>

Данная строка будет выглядеть на экране следующим образом:

Для получения примера смотри страницу

Ссылки на точки внутри документа

Вы можете делать ссылки на различные участки или разделы одного и того же документа, используя специальных скрытый маркер для этих разделов. Это позволяет быстро переходить от раздела к разделу внутри документа, не используя скроллирование экрана. Как только вы щелкнете на ссылке, броузер переместит вас на указанный раздел документа, а строка, в которой стоит маркер данного раздела (обычно, первая строка раздела или заголовок раздела) будет ращзмещена на первой строке окна броузера (если данная строка не присутствует уже на экране броузера).

Для создания такой ссылки необходимо выполнить следующие шаги:

1. Создайте маркер раздела. Синтаксис данного маркера следующий:

<A NAME="named_anchor"> Текст-который-отобразится-в-первой-строке-броузера </A>

2. Создайте ссылку на данный маркер:

<A HREF="#named_anchor"> Текст </A>

Например:

<p><b>Список разделов</b></p>
<ul> <li><a href="#ex1">Раздел 1</a></li>
<li><a href="#ex2">Раздел 2</a></li> </ul>
<p><a name="ex1"></a>Раздел 1</p>
<ul> <p>Текст раздела 1</p> </ul>
<p><a name="ex2"></a>Раздел 2</p>
<ul> <p>Текст раздела 2 <br></p>

Список разделов

  • Раздел 1
  • Раздел 2

Раздел 1

Текст раздела 1

Раздел 2

Текст раздела 2

Символы "#ex1" сообщает вашему броузеру, что необходимо найти в данном HTML-документе маркер с именем "ex1".

Когда пользователь щелкнет мышью на строке "Раздел 1", броузер перейдет сразу к разделу 1.

Внимание! Как ранее было показано в синтаксисе URL, маркер раздела может быть поставлен как в том же документе, который просматривается в текущий момент, так и в другом документе. Во втором случае броузер осуществит подгрузку другого документа и перейдет к указанному для него разделу.

URL

Обязательный параметр, имеющий такой же синтаксис, как и стандартный URL. Данный URL указывает броузеру где находится рисунок. Рисунок должен храниться в графическом формате, поддерживаемом броузером. На сегодняшний день форматы GIF и JPG поддерживаются большинством броузеров.

ALT="text"

Данный необязательный элемент задает текст, который будет отображен броузером, не поддерживающим отображение графики или с отключенной подкачкой изображений. Обычно, это короткое описание изображения, которое пользователь мог бы или сможет увидеть на экране. Если данный параметр отсутствует, то на месте рисунка большинство броузеров выводит пиктограмму (иконку), активизировав которую, пользователь может увидеть изображение. Тэг ALT рекомендуется, если ваши пользователи используют броузер, не поддерживающий графический режим, например Lynx.

HEIGTH=n1

Данный необязательный параметр используется для указания высоты рисунка в пикселах. Если данный параметр не указан, то используется оригинальная высота рисунка. Это параметр позволяет сжимать или растягивать изображения по вертикали, что позволяет более четко определять внешний вид документа. Однако, некоторые броузеры не поддерживают данный параметр. С другой стороны, экранное разрешение у вашего клиента может отличаться от вашего, поэтому будьте внимательны при задании абсолютной величины графического объекта.

WIDTH=n2

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

ALIGN

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

ISMAP

Этот параметр сообщает броузеру, что данное изображение позволяет пользователю выполнять какие-либо действия, щелкая мышью на определенном месте изображения. Данная возможность является расширением HTML и будет обсуждена нами позже.

Приведем пример использования данного тэга:

< IMG SRC="http://www.softexpress.com/images/nekton.jpg" ALT="СофтСервис лого" ALIGN="top" ISMAP>

С версии HTML 2.0 у тэга <IMG> появились дополнительные параметры:

<IMG SRC=" URL " ALT=" text " HEIGHT=n1 WIDTH=n2 ALIGN= top|middle|bottom|texttop| absmiddle|baseline|absbottom BORDER=n3 VSPACE=n4 HSPACE=n5 ISMAP>

Новые параметры:

BORDER

Данный параметр позволяет автору определить ширину рамки вокруг рисунка.

VSPACE

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

HSPACE

То же самое, что и VSPACE, но только по горизантали.

Фоновые рисунки

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

Описание фонового рисунка включается в тэг BODY и выглядит следующим образом:

< BODY BACKGROUND=" picture.gif ">

Задание стандартных цветов

Многие HTML-авторы любят использовать заранее предопределенные цвета фона документа, обычного текста и ссылок. Чтобы задать эти цвета, необходимо включить в тэг <BODY> дополнительные параметры:

< BODY BGCOLOR="#XXXXXX" TEXT="#XXXXXX" LINK="#XXXXXX">

где каждый из параметров определяет цвет того или иного элемента. Опишем эти параметры:

BGCOLOR

Цвет фона документа

TEXT

Цвет простого текста документа

LINK

Цвет ссылки

Цвет задается шестизначным числом в шестнадцатиричном формате по схеме RGB (Red, Green, Blue). Цвет #000000 соответствует черному, а цвет #FFFFFF - белому. Например:

<BODY BGCOLOR="#000000" TEXT="#FFFFFF" LINK="#9690CC">

Данная строка определяет белый цвет фона документа, черный текст и серебристые ссылки.

Горизонтальная линия

Используя тэг <HR> вы можете разделить текст горизонтальной чертой.

Формат тэга:

<HR SIZE=number WIDTH= number|percent ALIGN= left|right|center NOSHADE >

Параметры тэга:

SIZE

Толщина линии в пикселах.

WIDTH

Ширина линии в пикселах или процентах от ширина окна броузера.

ALIGN

Расположение на экране (слева | по центру | справа).

NOSHADE

По умолчанию линия представлена в 3D виде с тенью. NOSHADE позволяет представить линию просто однотонной темной полоской.

Специальные тэги HTML

Следующие тэги позволят вам сделать ваш HTML-документ более функциональным.

Тэг адреса <ADDRESS>

Тэг <ADDRESS> используется для выделения автора документа и его дреса (например, e-mail). Синтаксис:

<ADDRESS> Адрес-автора </ADDRESS>

Escape-последовательности

Некоторые символы являются управляющими символами в HTML и не могут напрямую использоваться в документе:

  • левая угловая скобка "<"
  • правая угловая скобка ">"
  • амперсанд "&"
  • двойные кавычки """

Чтобы использовать данные символы в документе, необходимо заменить их escape-последовательностями:

< &lt;
> &gt;
& &amp;
" &quot;

Существует большое количество escape-последовательностей для обозначения специальных символов, например "&copy;" для обозначения знака © и &reg; для значка ®, появившихся в HTML 2.0. Одной из особенностей является замена символов во 2-ой части символьной таблицы (после 127-ого символа) на escape-последовательности для передачи текстовых файлов с национальными языками по 7-битным каналам.

Внимание! Escape-последовательности чувствительны к регистру: НЕЛЬЗЯ использовать &LT; вместо &lt;.

 

Произвольные тэги

Произвольные Тэги предоставляют вам всю мощь языка Java наряду с почти совершенной интеграцией в ваш уровень представления. [6]

Произвольные теги - это JSP теги самостоятельного производства. Для полного понимания смысла, вам необходимо, прежде всего, четко представлять себе, что такое тэги.

Есть шансы, что вы активно использовали теги и до прочтения этой главы. Очень мало разработчиков в наши дни работают в средах, которые полностью отделены от Internet, а это значит, что вы, вероятно, имеете как минимум основы знаний HTML или XML.

В языке разметки, таком как HTML или XML, структура встраивается в данные. Это позволяет синтаксическому анализатору, такому как браузер, интерпретировать инструкции для отображения или хранить информацию.

Основным механизмом для этого являются тэги.

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

Другой важный механизм для применения этой структуры к данным - это атрибуты, которые делают тэги немного более сложными, такие как, например, тэг "table" в HTML. Тэг таблицы может иметь атрибут бордюра, то есть <table border="3">, это значение атрибута border, применяется к данным, которые появятся после тэга <table> и перед тэгом </table>. Эти данные, находящиеся между двумя тэгами, являются телом тэга. Все данные в теле этого тэга будут отображаться в таблице, а бордюр вокруг каждого элемента таблицы будет толщиной "3".

В случае тэга таблицы в HTML все более усложняется, поскольку тело тега может содержать другие тэги наряду с данными, позволяя вложение. Другими словами, вы можете определить строку в таблице и данные таблицы (или колонку) в строке. Это позволяет создать хорошее структурирование данных.

Пример:

<table border=”3”>

<tr>

<td>black</td>

<td>white</td>

</tr>

</table>


Здесь определена таблица с размером бордюра равным трем, одной строкой и двумя колонками, содержащая данные black и white. Слова black и white являются элементами данных, которые составляют тело тэга <td> или тэга данных таблицы (table data). Тэг <tr>, или тэг строка таблицы (table row), со своим встроенным тэгом <td> и данными составляет тело тега таблицы. Вы можете четко видеть, что взаимосвязь между этими тегами важна. Тэг строки таблицы <tr>, имеет мало смысла вне пределов тэга таблицы, аналогично, тэг данных таблицы <td> не имеет смысла вне пределов тега строки таблицы. Мы ссылаемся на тэг таблицы, как на родительский для тэга строки таблицы, а на тэг строки таблицы, как на родительский для тега данных таблицы.

XML вводит идею пространства имен, которое дает вам немного больше гибкости при именовании тэгов. (Более детально смотрите главу об XML.) Если вы хотите создать свой собственный язык разметки, аналогичный HTML, вы можете определить пространство имен, называемое mytags, и определить ваш собственный тэг в нем, таким образом получиться тэг <mytag:table> и </mytag:table>. Смысл прост: это должно значить, что в данном случае не будет путаницы между оригинальным HTML тэгом table и вашим собственным, заново определенным тэгом table. Ваш тэг table находится в собственном пространстве имен. Это значит, что вы можете использовать последовательную конвенцию имен, то есть вызов "table" предпочтительнее "myspecialtable", когда не нужно беспокоиться о коллизии с определением в HTML стандарте.

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

Итеративные тэги

Одна из наиболее мощных особенностей произвольных тэгов в JSP - это то, что они могут итерировать, как цикл for или while в Java и, таким образом, производить динамический вывод.

Давайте рассмотрим более сложный тэг, который реально делает итерации по содержимому своего тела, воспроизводя переменный вывод в зависимости от своих атрибутов.

Предположим, что вы хотите сгенерировать список простых чисел (чисел, делящихся только на себя и на 1) и отобразить его в HTML в виде ненумерованного списка. Что вам действительно желательно - это тэг, который может генерировать все простые числа в пределах указанного диапазона, предоставит вам доступ к каждому значению и поместит его в желаемый вам формат. Так как вы не знаете, сколько чисел будет в заданном диапазоне, а их может быть несколько, вы не захотите набирать HTML тэги для списка <li> и </li> для каждого из них. Допустим, что ваш тэг называется primtag, и вы хотите, чтобы ваш JSP файл выглядел примерно так:

<ul>

<tijtags:primetag start = "1" end= "25">

<li><%=value%></li>

</tijtags:primetag>

</ul>


Обратите внимание, что есть начальный и конечный HTML тэги <ul>, окружающий весь блок. **(HTML лекция выходит далеко за пределы темы этой главы, но коротко скажу, что они определяют ненумерованный список и внутри тела того тэга все данные между парой <li> и </li> будут отображаться, как помеченный элемент списка.)

Следующее, что вы заметите, это ссылка на хор



Поделиться:


Последнее изменение этой страницы: 2016-08-01; просмотров: 194; Нарушение авторского права страницы; Мы поможем в написании вашей работы!

infopedia.su Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав. Обратная связь - 3.133.107.11 (0.011 с.)