Техника Web-дизайна для студента

Метки форматирования текста

Под форматированием текста подразумевается изменение внеш­него вида документа путем разбиения его на абзацы, выравнива­ния абзацев, проведения горизонтальных разделительных линий, создания списков.

О Создание абзаца: <р>...</р>.

Пример записи: <Р ALIGN=RIGHT>TeKCT абзаца</Р>.

Параметр align позволяет задать выравнивание строк абзаца и может иметь следующие значения:

• left — выравнивание по левому краю (действует по умол­чанию);

• right — выравнивание по правому краю;

• center — центрирование строк;

• justify — выравнивание по ширине (по правой и левой сторонам).

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

Закрывающая метка </р> не обязательна.

Абзацы отделяются друг от друга интервалами, равными пустой строке. Первая строка абзаца не имеет отступа.

О Переход на новую строку в пределах абзаца: <ве>.

Текст, располагающийся после метки <ве>, будет воспроиз­водиться с начала новой строки, при этом строки абзаца со­хранят выравнивание, заданное для всего абзаца.

О Вставка текста, предварительно отформатированного в тек­стовом редакторе: <рее>...</рее>.

Пример записи: <рее>тєкст</рее>

Использованные в предварительно отформатированном тек­сте переходы на новую строку, пробелы, символы табуляции сохранятся при выводе его браузером. Текст будет выводиться моноширинным шрифтом;

О Отображение фрагмента текста с отступом: <вшскаиотЕ>... </ВЬОСК! ЗиОТЕ>.

Пример записи: <вшскоиотЕ>текст</вшскоиотЕ>.

Основное назначение <вьоскоиотЕ> — выделение фрагментов текста (например цитат) путем изменения их положения от­носительно остального текста. Текст сдвигается на несколько позиций вправо, перед и после текста устанавливаются ин­тервалы.

О Создание маркированного списка: <иь>...</иь>.

Список представляет собой последовательность абзацев, на­чала которых при выводе списка браузером будут отмечены специальным значком (маркером). До и после списка будут добавлены интервалы.

Пример записи:

<иь ТУРЕ=СІІЗС>

<Ы>Первый абзац списка <Ы>Второй абзац списка

<Ы>Последний абзац списка

</иь>

Метка <ы> отмечает начало абзаца, что обеспечивает его вы­вод с новой строки.

Параметр TYPE позволяет задать тип маркера и может при­нимать значения:

• disc — закрашенный кружок;

• circle — не закрашенный кружок (действует по умолча­нию);

• square — закрашенный квадрат.

Следует обратить внимание, что вопреки принципу нечувст­вительности к регистру, характерному для HTML, перечис­ленные выше значения параметра type, нужно писать только строчными буквами.

Допускается использование параметра type в метке <li>.

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

<UL>

<FONT FACE="wingdings">&#74;</FONT>nepBaH строка списка<ВЕ> <FONT FACE="wingdings">&#76;</FONT>BTopaH строка списка<ВЕ> <FONT FACE="wingdings">&#7 9;</FONT>TpeTbH строка списка<ВЕ> <FONT FACE="wingdings">&#60;</FONT>4eTBepTaH строка списка<ВЕ> <FONT FACE="wingdings">&#38;</ЕОЫТ>Пятая строка списка </UL>

Дополнив фрагмент соответствующими метками, в окне брау­зера увидим результат, приведенный на рис. 1.3.

Чтобы в качестве маркера использовать рисунок, нужно вме­сто метки <font> поставить метку рисунка <img>. например: <UL>

<IMG ЗРС="имя файла рисунка">Первая строка списка<ВЕ> <IMG ЗРС="имя файла рисунка">Вторая строка списка </UL>

О размещении рисунков см. в главе 3. о Создание нумерованного списка: <ol>...</ol>.

Пример записи:

<0L TYPE=a START=3>

<Ы>Первый элемент списка

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

• а — нумерация большими латинскими буквами;

• а — нумерация маленькими латинскими буквами;

• I — нумерация большими римскими цифрами;

• i — нумерация маленькими римскими цифрами;

• 1 — нумерация арабскими цифрами (действует по умолча­нию).

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

Метка <li> может иметь параметры: type — изменяет вид номера только для данного элемента списка, value — изме­няет вид номера данного элемента списка с изменением ну­мерации последующих абзацев.

Пример записи:

<OL>

<LI> Первый элемент списка

<LI TYPE=a VALUE=1> Первый элемент второго списка

<LI TYPE=a> Второй элемент второго списка

<LI VALUE=2> Второй элемент списка

<LI> Третий элемент списка

</0L>

В окне браузера такой список будет выглядеть как на рис. 1.4.

Допускается создание многоуровневого списка, когда один список вкладывается в другой независимо от типа. Список более низкого уровня вложения будет изображаться в браузе­ре смещенным вправо относительно списка предыдущего уровня вложения (листинг 1.3).

Листинг 1.3. Создание многоуровневого списка

<0L>

<Ы>Холодные закуски

<иь>

<Ы>Винегреты

<иь>

<Ы>Винегрет овощной <Ы>Винегрет с рыбой

</иь>

<Ы>Салаты

<иь>

<Ы>Салат зеленый <Ы>Салат "Весна"

<Ы>Салат витаминный

</иь>

</иь>

<Ы>Супы

<иь>

<Ы>Щи

<иь>

<Ы>Щи из свежей капусты <Ы>Щи из квашеной капусты <Ы>Щи боярские

</иь>

<Ы>Борщи

<иь>

<Ы>Борщ московский <Ы>Борщ украинский <Ы>Борщ флотский

</иь>

</иь>

</0Ь>

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

О Создание списка определений: <оь>...</оь>.

Список определений включает определяемый термин, перед которым ставится метка <бт> и абзац с его определением, ко­торому предшествует метка <об>.

Пример записи:

<оь>

<ОТЖвадрат

<00>Прямоугольник, у которого все стороны равны <ОТ>Ромб

<00>Параллелограмм, у которого все стороны равны </0Ь>

В окне браузера увидим результат, приведенный на рис. 1.6.

О Создание горизонтальной разделительной линии: <нн>.

Создается рельефная разделительная линия. До и после ли­нии вставляется пустая строка.

Пример записи: <hr align=left width=60cc size=7>.

В метке могут использоваться параметры:

• align — выравнивает линию по левому краю, по правому краю или по центру в зависимости от значения (LEFT, RIGHT, CENTER - по умолчанию);

• width — позволяет задать длину линии в пикселях или в процентах от ширины окна браузера (в этом случае после значения записывается знак %);

• size — позволяет задать толщину линии в пикселях;

• noshade — отменяет рельефность линии;

• color — позволяет задать цвет линии (при задании цвета линия теряет рельефность).