Каскадные таблицы стилей: язык CSS 

В этой главе приведено описание свойств, определяющих различные параметры отображения текста. Красная строка: свойство text-indent Синтаксис: text-indent: <размер> | <процент> | inherit Начально: 0 Применимо: к блочным элементам Наследуемо: да Проценты: относительно ширины вмещающего блока Устройства: визуальные Поддержка: Соответствует стандарту (4.0+) Соответствует стандарту (4.0+) Свойство text-indent задает отступ первой строки при отображении блочных элементов. Отступ может быть отрицательным и задается одним из следующих способов: <размер> Задает фиксированный размер. <процент> Вычисляется относительно ширины вмещающего блока. Пример: следующее правило указывает, что абзацы должны начинаться с красной строки, равной 3em: P { text-indent: 3em } Выравнивание текста: свойство text-align Синтаксис: text-align: left | right | center | justify | <строка> | inherit Начально: зависит от обозревателя и направления вывода текста Применимо: к блочным элементам Наследуемо: да Проценты: не используются Устройства: визуальные Поддержка: Поддерживаются только left, right, center и justify (4.0+) Поддерживаются только left, right и center (4.0+) Свойство text-align задает выравнивание текста при отображении блочных элементов. Оно может принимать следующие значения: left Выравнивание по левому краю. right Выравнивание по правому краю. center Выравнивание по центру. justify Выравнивание по левому краю с выключкой по правому краю. <строка> Задает строку, по которой будут выравниваться ячейки в столбце таблицы. Это значение применимо только к ячейкам таблицы. Для остальных элементов должно трактоваться как left или right в зависимости от значения свойства direction (ltr или rtl соответственно). Пример: следующее правило указывает, что все элементы, содержашиеся в элементе DIV с атрибутом class="center", должны выравниваться по центру окна обозревателя (это обеспечивается тем, что данное свойство является наследуемым): DIV.center { text-align: center } Украшение текста: свойство text-decoration Синтаксис: text-decoration: none | [underline || overline || line-through | | blink] | inherit Начально: none Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные Поддержка: Соответствует стандарту; blink не поддерживается (4.0+) Соответствует стандарту; overline не поддерживается (4.0+) Свойство text-decoration задает украшение текста при отображении элементов. Оно может принимать следующие значения: none Обычный текст. пример underline Подчеркнутый текст. пример overline Надчеркнутый текст. пример line-through Перечеркнутый текст. пример blink Мигающий текст. пример Это свойство не наследуемо, но все потомки блочного элемента будут иметь его украшения текста. Цвет этих украшений будет тем же, что у блочного элемента, даже если потомки имеют другое значение свойства color. Пример: следующее правило указывает, что гиперссылки должны подчеркиваться: A:link { text-decoration: underline } Преобразование текста: свойство text-transform Синтаксис: text-transform: none | capitalize | uppercase | lowercase | inherit Начально: none Применимо: ко всем элементам Наследуемо: да Проценты: не используются Устройства: визуальные Поддержка: Соответствует стандарту (4.0+) Соответствует стандарту; реализовано с ошибками (4.0+) Свойство text-transform задает преобразование текста при отображении элементов. Оно может принимать следующие значения (Netscape Navigator 4.x отображает примеры неверно!): none Без преобразования. Это пример. capitalize Делать первую букву каждого слова прописной. Это пример. uppercase Выводить текст прописными буквами. Это пример. lowercase Выводить текст строчными буквами. Это пример. Фактическое преобразование символов зависит от языка, на котором написан текст. Пример: следующее правило указывает, что заголовок H1 должен выводиться прописными буквами: H1 { text-transform: uppercase } Задание тени: свойство text-shadow Синтаксис: text-shadow: none | [<цвет> || <размер> <размер> <размер>?,]* [<цвет> || <размер> <размер> <размер>?] | inherit Начально: none Применимо: ко всем элементам Наследуемо: нет Проценты: не используются Устройства: визуальные Поддержка: Не поддерживается Не поддерживается Свойство text-shadow задает тень текста при отображении элементов. Его значением является список эффектов, разделенных запятыми. Эти эффекты должны применяться к тексту в том порядке, как они заданы, и могут перекрываться при отображении друг с другом (но не с самим текстом!). Каждый эффект задается обязательным смещением от текста и необязательными цветом тени и радиусом пятна. Смещение тени относительно текста задается двумя значениями типа <размер>, первое из которых указывает горизонтальное смещение тени вправо от текста, а второе — вертикальное смещение тени вниз от текста. Эти значения могут быть отрицательными, что означает смещение тени влево или вверх относительно текста соответственно. После смещения может быть указан необязательный радиус пятна. Точный алгоритм вычисления пятна не задан и зависит от обозревателя. Кроме того, перед указанными размерами или после них может быть задан необязательный цвет тени. Если он не задан, то используется значение свойства color. Тени могут применяться к псевдоэлементам :first-letter и :first-line. Примеры: H1 { text-shadow: 0.2em 0.3em } H2 { text-shadow: 3px 3px 5px red } H3 { text-shadow: 3px 3px red, yellow -3px 3px 2px, 3px -3px } В первом примере задана тень со смещением 0.2em правее текста и 0.3em ниже его. Во втором примере заданы смещения по 3px правее и ниже текста, радиус пятна 5px и красный цвет тени. Последний пример содержит список из трех эффектов. Интервал между буквами: свойство letter-spacing Синтаксис: letter-spacing: normal | <размер> | inherit Начально: normal Применимо: ко всем элементам Наследуемо: да Проценты: не используются Устройства: визуальные Поддержка: Соответствует стандарту (4.0+) Не поддерживается Свойство letter-spacing задает интервал между буквами при отображении текста. Его значение задается одним из следующих способов: normal Стандартный интервал для текущего шрифта. <размер> Задает интервал в дополнение к стандартному интервалу. Это значение может быть отрицательным. Пример: следующее правило увеличивает интервал между символами в заголовке H1 на 0.5em: H1 { letter-spacing: 0.5em } Интервал между словами: свойство word-spacing Синтаксис: word-spacing: normal | <размер> | inherit Начально: normal Применимо: ко всем элементам Наследуемо: да Проценты: не используются Устройства: визуальные Поддержка: Не поддерживается Не поддерживается Свойство word-spacing задает интервал между словами при отображении текста. Его значение задается одним из следующих способов: normal Стандартный интервал для текущего шрифта. <размер> Задает интервал в дополнение к стандартному интервалу. Это значение может быть отрицательным. Алгоритм выбора интервалов между словами зависит от обозревателя и от наличия выключки текста по правому краю (см. свойство text-align). Пример: следующее правило увеличивает интервал между словами в заголовке H1 на 1em: H1 { word-spacing: 1em } Обработка пробелов: свойство white-space Синтаксис: white-space: normal | pre | nowrap | inherit Начально: normal Применимо: к блочным элементам Наследуемо: да Проценты: не используются Устройства: визуальные Поддержка: Не поддерживается Поддерживаются только значения normal и pre (4.0+) Свойство white-space задает правила обработки пробелов при отображении блочного элемента. Оно может принимать следующие значения: normal Пробелы и разрывы строк отображаются обычным образом. pre Пробелы и разрывы строк отображаются как в форматированном тексте. nowrap Пробелы отображаются обычным образом, но разрывы строк запрещены. Пример: следующие правила соответствуют правилам HTML по отображению элементов P и PRE: P { white-space: normal } PRE { white-space: pre }