
- •Теоретический материал для подготовки к практической работе по теме «Работа с текстом и списками» (средствами 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.4.3. Межстрочное расстояние
Р
асстояние
между строками (интерлиньяж) можно
назначить с помощью параметра
line-height.
Точнее говоря, он определяет высоту
строки, задаваемую ключевым словом
normal
(значение по умолчанию) или числом с
указанием единиц измерения, включая
проценты.
При задании процентов высота строки вычисляется относительно размера шрифта. Вообще говоря, значения данного параметра интерпретируются различными браузерами не совсем одинаково. Точную картину можно выяснить экспериментально. На рис. показаны примеры, иллюстрирующие в некоторой мере влияние данного параметра на межстрочное расстояние. На практике параметр line-height со значением, отличным от normal, применяют в исключительных случаях, например когда требуется разместить текст в контейнере с очень ограниченными размерами (на кнопке).
1.4.4. Межсловное расстояние
Расстояние между словами можно установить с помощью параметра word-spacing, который принимает следующие значения:
- normal - расстояние между словами обычное, как при отсутствии параметра;
- значение - число с указанием единиц измерения.
Если установлен параметр text-align: justify (выравнивание одновременно по левому и правому краям), то word-spacing не действует. В этом случае межсловное расстояние устанавливается автоматически исходя из цели выравнивания текста. Нулевое значение соответствует обычному расстоянию меду словами, а при отрицательных значениях результат зависит от браузера.
Т
ак,
Internet
Explorer
и Opera
в последнем случае отображают слова
слитно, а остальные браузеры - с
перекрытием. По существу значение
word-spacing
означает приращение длины пробела,
принятой по умолчанию.
На рис. показан пример форматирования текстовой строки с помощью параметра word-spacing.
1.4.5. Межбуквенное расстояние
Р
асстояние
между буквами регулируется параметром
letter-spacing,
который принимает следующие значения:
- normal - расстояние между словами обычное, как при отсутствии данного параметра;
- значение - число с указанием единиц измерения.
Без данного параметра межбуквенное расстояние устанавливается автоматически на основе характеристик шрифта. С помощью letter-spacing можно представить слово или блок текста вразрядку или, наоборот, в сжатом виде. При этом межсловное расстояние изменяется пропорционально межбуквенному.
Нулевое значение соответствует обычному расстоянию меду буквами, а при отрицательных значениях параметра строка может стать нечитабельной.
На рис. показан пример форматирования текстовой строки с помощью параметра letter-spacing.
1.4.6. Декорация
Т
екстовые
строки можно оформить специальным
образом или, как еще говорят, декорировать.
Например, их можно подчеркнуть снизу
или сверху, перевести в верхний или
нижний регистры или зачеркнуть. Иногда
требуется, чтобы каждое слово в строке
начиналось с прописной буквы. Для такой
декорации текста применяется параметр
text-decoration,
который принимает следующие значения:
none - отменяет любое декорирование (значение по умолчанию для большинства тегов); в частности, применение данного значения к тегу ссылки <а> отменяет принятое по умолчанию подчеркивание текста или отображение рамок около графического изображения ссылок;
underline - подчеркивает текст;
overline - добавляет черту над текстом;
line-through - зачеркивает текст;
lowercase - отображает текст в нижнем регистре (строчными символами);
uppercase - выводит текст в верхнем регистре (прописными символами);
blink- создает эффект мигания (не во всех браузерах). На рис. слева приведен пример для некоторых значений параметра text-decoration. На рис. справа приведен пример создания простой математической формулы с помощью параметра text-decoration. Здесь квадратный корень отображается специальным символом √, а линии прорисованы посредством установки соответствующих значений параметра text-decoration.