
- •Теоретический материал для подготовки к практической работе по теме «Работа с текстом и списками» (средствами xhtml и css)
- •Часть 1. Работа с текстом
- •1.1. Шрифты
- •1.2. Основные теги разметки текстов
- •1 .3. Специальные символы
- •1.4. Форматирование текста
- •1.4.1. Красная строка
- •1.4.2. Выравнивание
- •1.4.3. Межстрочное расстояние
- •1.4.4. Межсловное расстояние
- •1.4.5. Межбуквенное расстояние
- •1.4.6. Декорация
- •1.4.7. Индексы
- •1.4.8. Выделение первой буквы строки и первой строки в блоке текста
- •1 .4.9. Объемный текст
- •1.4.10. Преобразование регистра
- •1.4.11. Мультиколоночная верстка
- •1.5. Предварительно отформатированный текст
- •1.6. Генерируемое содержимое
- •Часть 2. Списки
- •2.1. Маркированный список
- •2.2. Нумерованный список
- •2.3. Автоматическая нумерация элементов списка
- •2.4. Иерархический раскрывающийся список
- •2.5. Меню на основе списка
- •2.6. Выравнивание элементов списка
- •Раздел 1 Раздел 1 Раздел 1
- •Раздел 1 Раздел 1
- •2.7. Список определений
1 .3. Специальные символы
При формировании (Х)НТМL-документа может потребоваться ввести символы, которые воспринимаются браузером как служебные. Например, символы < и > для обозначения знаков "меньше" и "больше" недопустимы, т. к. они интерпретируются как символы тегов. Кавычки (") и амперсанд (&) также применяются в языке HTML для служебных целей. Все символы, которые можно набрать при нажатых клавишах управления, отличных от <Shift>, могут не воспроизводиться при просмотре (Х)НТМL-документа, поскольку они зарезервированы. Кроме того, несколько пробелов, введенных подряд, браузер воспримет как один символ (проблема создания отступов с помощью символа пробела). В этих случаях можно прибегнуть к буквенным или числовым эквивалентам символов. Последние однозначно соответствуют их кодам ASCII.
Формат буквенного эквивалента символа:
&буквенный_эквивалент;
Например, <- обозначает символ < (от англ, less then - меньше чем).
Формат числового эквивалента:
&#код_ ASCII;
Например, символ < можно вставить в документ как <. Символ пробела имеет буквенный эквивалент  , и числовой .
Таким образом, эквиваленты заключаются между символами & и ;. В случае цифрового эквивалента перед ASCII-кодом символа следует поставить символ #.
На рис. показано соответствие между часто встречающимися символами, их числовыми и буквенными эквивалентами.
1.4. Форматирование текста
Для выделения абзацев, как уже неоднократно говорилось, предназначен контейнерный блоковый тег <р>. Текст внутри данного тега отображается с новой строки без отступа (т. е. без красной строки) во всю ширину клиентской части окна браузера. Если окно браузера изменить, то содержимое абзаца снова распределится по всей ширине окна.
Вы можете задать параметры размеров (width и height), позиционирования (top, left, position) и отступов (padding) для элемента <р>, чтобы повлиять на расположение текста в абзаце. Разумеется, эти же параметры можно применить и к другим контейнерным тегам, содержащим текст, например <div>, <span>, <em> и т.д.
Цвет текста, заключенного в какой-нибудь контейнерный тег, задается параметрами CSS для данного контейнера. Так, цвет символов определяется параметром color, а фона - background или background-color.
Далее рассмотрим параметры CSS, влияющие на визуальное представление символов, слов и абзацев.
1.4.1. Красная строка
Д
ля
задания отступа первой строки текста
в блоке (так называемой красной строки)
служит параметр text-indent,
принимающий в качестве значения величину
отступа с указанием единиц измерения;
проценты выражают величину отступа
относительно ширины содержащего блока
(например, <div>,
<body>).
При отсутствии параметра text-indent отступ типа красной строки пришлось бы создавать последовательностью из нескольких специальных символов пробела или
<p> Текст текст текст текст </р>
1.4.2. Выравнивание
Для горизонтального выравнивания текста (любого последовательного содержимого блока) используется параметр text-align, принимающий значения: left (по левому краю), right (по правому краю), center (по центру) и justify (одновременно по обоим краям).
Для вертикального выравнивания текста служит параметр vertical-align, принимающий значения top (по верхнему краю), bottom (по нижнему краю), middle (по середине) и baseline (по базовой линии) и др.