Физические средства форматирования.

1. Одиночный дескриптор < br > - перевод строки (разрыв строки)

.

2. Парный дескриптор < nobr >…</ nobr > - запрещает разрыв текста, находящегося в контейнере. Данный дескриптор еще называют дескриптор жесткого переноса.

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

 

 

3. Одиночный дескриптор < wbr > - определяет место мягкого переноса. Данный дескриптор используется совместно с дескриптором <nobr > и размещается внутри его контейнера.

Браузер осуществляет перенос в соответствии с этим дескриптором только в том случае, если строчка не помещается в ширину окна и обычный перенос запрещен с помощью дескриптора <nobr >.

4. Парный дескриптор< p >…</ p > - параграф или абзац. Текст, находящийся внутри дескриптора оформляется в виде параграфа или абзаца.

Атрибут ALIGN = выравнивание текста. 

Возможные значения:

· =LEFT – по левому краю.

· =CENTER – по центру.

· =RIGHT – по правому краю.

 

5. Парные дескрипторы заголовка.

  Бывают шести уровней:

< H1 > … </ H1 >

… … …

< H6 > … </ H6 >

Текст заголовка выравнивается, до и после текста интервал.

       Допустимо использование атрибута ALIGN.

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

 

6. Дескриптор < HR > – одиночный горизонтальный дескриптор.

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

Атрибуты:

· ALIGN

· COLOR –цвет черты (значения как у background).

· WIDTH – ширина линии (в пунктах).

· SIZE – толщина линии (в пунктах).

· NOSHADE – без тени.

 

7. Парный дескриптор < FONT > … </ FONT >.

Предназначен для определения шрифта (начертания) отображаемого текста (курсив и так далее).

Атрибуты:

· FACE – название шрифта.

Пример:

FASE=”Times New Roman”

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

· COLOR

· SIZE =3 -по умолчанию. (Размер символов может быть от 1 до 7).

 

8. Одиночный дескриптор < BASEFONT >

Данный дескриптор устанавливает базовое значение текстовых значений Web страниц, находящихся после < BASEFONT >. Атрибуты как у дескриптора < FONT >.   

 

9. Парный дескриптор < PRE > … </ PRE > - дескриптор пре форматирования.

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

Пример:

<PRE>

_ _ _ _ _ _ _ _ _ _ _ _ _ _
|_ _ _ _ _ _ _|_ _ _ _ _ _ _|

|_ _ _ _ _ _ _|_ _ _ _ _ _ _|           

</PRE>

 

10. Парный дескриптор < DIV > … </ DIV >

Используется для выравнивания группы элементов таблицы (группа – несколько текстовых или графических элементов). Все, что внутри таблицы выравнивается.

Пример:

< DIV >

Align

< / DIV >

10. Парный дескриптор < Center > … </ Center >

Все содержимое контейнера данного дескриптора выравнивается по центру.

 

 

Советы по форматированию текстовых фрагментов

 

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

2. Использовать как можно меньшее число шрифтов (2-3). Принято для отображения заголовков использовать шрифты типа Arial (то есть без засечек), а шрифты с засечками для самого текста (например, ТАЙМС).

3. Реже используйте выделения, подчеркивания и жирные шрифты.

 

Существуют так же дескрипторы:

1) < b >…</ b > - выделяет текст в контейнере с помощью жирного шрифта.

2) < i >…</ i > - выделяет текст в контейнере с помощью наклонного текста (курсив).

Пример логического форматирования.

1) Парный дескриптор < CITE > … </ CITE >

Используется для цитат. Обычно браузером отображается в виде курсива (наклонного текста).

2) Парный дескриптор < BLOCKQUOTE > … < / BLOCKQUOTE >

Используется для выделения больших цитат. (Браузер обычно делает отступ от левого края).

 

В большинстве случаев браузер не допускает пересечение дескрипторов.

Пример пересечения:

< PRE >

< FONT >

</PRE >

</FONT >

(В лучшем случае просто не запустится).

 

Но есть и исключения, например < b>… < i >…</ b > …</i >

В том месте, где пересеклись дескрипторы <i> и < b>, текст будет выделен жирным курсивом.

3) Парный дескриптор < U >…</ U > - подчеркивание.

 

 

Специальные символы

 

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

Например, (>) - больше или (<) – меньше. Браузер ее воспринимает как начало контрольной последовательности.

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

1) & lt - отобразится левая скобка.

2) & gt - отобразится правая скобка.

3) & copy - отобразится значок авторского права.

4) & deg - отобразится значок температуры.

5) & nbsp; отобразится символ пробела (жесткого пробела). Если пробел указан с помощью данного специального символа, то разрыв строки не допускается, так как браузер будет видеть слова и пробелы как одно слово.

 

 

Сложное форматирование

 

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

Пример:

<OL>

<LI>abc</LI>

<LI>def</LI>

</OL>

Данная конструкция формирует нумерованный список, при этом дескриптор <OL> является дескриптором, который определяет способ форматирования. В браузере отобразится:

1.abc или a. abc

2.def          b. def

 

1. Парный дескриптор < LI > …</ LI > (от английского слова List - список) используется для отображения элементов списка. Атрибутов не имеет.

 

2. Парный дескриптор < OL > …</ OL > - формирует нумерованный список (или упорядоченный).

· Изменение способа нумерации производится с помощью атрибута TYPE.

Например:

<OLTYPE=[1/a/A/I], где

1 - арабские цифры.

а – прописные буквы.

А – заглавные буквы.

I – римские цифры.

· Атрибут START позволяет указать номер, с которого начинается нумерация.

Например, если START=3, то нумерация начнется с трех или с буквы “c”.

 

2. Парный дескриптор < UL > …</ UL >

Формирует не упорядоченный список (маркерный).

· abc

· def

Например:

<ULTYPE=disc, square, circle>

<LI>abc</LI>

</ UL >

Где disc – жирная точка; square - квадрат; circle – не закрашенная окружность.

При отображении элементов списка браузер делает отступ слева.

 

Многоуровневые списки.

Например:

<ULTYPE=disc, square, circle>

<LI>abc</LI>

       <UL>

                   <LI>def</LI>

<LI>ghi</LI>

</ UL >

</ UL >

Отобразиться:

· abc

o def

o ghi

Браузер будет делать очередной отступ слева.

 

Таблицы.

1. Парный дескриптор < TABLE > …</ TABLE >

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

2. Парный дескриптор < TR > …</ TR > - формирует строку таблицы.

3. Парный дескриптор < TD > …</ TD > - формирует ячейку внутри строки.

Пример:

 

<TABLE>

<TD>1</TD>	<TD>2</TD>
<TD>3</TD>	<TD>4</TD>

<TR> <TR>

<TR> <TR>
                                          </TABLE>

 

 

Атрибуты дескриптора < TABLE >:

· Атрибут WIDTH – определяет ширину таблицы (в процентах или пикселях).

Пример:

<TABLE или WIDTH=200>

· Атрибут HEIGHT – высота (принимает такие же значения, как и атрибут WIDTH).

· Атрибут ALIGN – выравнивание таблицы по ширине относительно краев окна.

· Атрибут BORDER – определяет ширину рамки (если значение данного атрибута 0, то рамки отсутствуют).

· Атрибут bgcolor – для формирования фона таблицы с помощью цвета.

· Атрибут background - для формирования фона таблицы с помощью картинки.

· Атрибут cellpadding – для указания отступов от краев ячейки (в пикселях).

· Атрибут cellspacing – расстояние между ячейками.

	Если значение атрибута больше нуля, то таблица выглядит так:

Обычная таблица           

 

                                                          

 

 

 

 

· Атрибут bordercolor – цвет границ ячеек (рамки).

 

Атрибуты дескриптора < TR >:

1) Атрибут ALIGN – выравнивание текста в ячейках.

2) Атрибут VALIGN – определяет вертикальное выравнивание текста в ячейках.

Возможные значенияатрибута VALIGN:

· = TOP – по верху.     

· = MIDDLE – по центру.

· = BOTTOM – по нижнему краю ячейки.

3) Атрибут bgcolor – для указания фона строки.

 

Атрибуты дескриптора < TD >:

· Атрибут ALIGN.

· Атрибут VALIGN.

· Атрибут bgcolor.

Вышеперечисленные атрибуты действуют так же, как для дескриптора <TR>.

       Дополнительно атрибуты:

· Атрибут COLSPAN – объединение ячеек, находящихся в одной строке. Значение атрибута равно количеству близлежащих ячеек находящихся в одной строке, которые будут объединены.

Пример:

<TABLE>

 

<TD COLSPAN=2>1</TD>
<TD>3</TD>	<TD>4</TD>

<TR> </TR>

<TR> </TR>

 

</TABLE>

 

· Атрибут ROWSPAN – объединение ячеек, находящихся в одном столбце. Значение атрибута указывает количество близлежащих ячеек находящихся в одном столбце, которые будут объединены.

Пример:

<TABLE>

 

<TD ROWSPAN=2>1</TD>	<TD>2</TD>
	<TD>4</TD>

<TR> </TR>

<TR> </TR>

 

</TABLE>