предыдущий следующий содержание свойства индекс
Содержание
Свойства, определённые в следующих разделах, влияют на визуальное представление символов, пробелов, слов и параграфов.
| Значение: | <length> | <percentage> | inherit |
| Начальное: | 0 |
| Применяется: | к элементам уровня блока |
| Наследуется: | да |
| Процентное: | относительно ширины содержащего блока |
| Носитель: | визуальный |
Это свойство специфицирует отступ первой строки текста в блоке. Точнее, оно специфицирует отступ первого бокса, всплывающего в первый строчный бокс блока. Бокс получает отступ относительно левого (или правого, для вывода справа-налево) края строчного бокса. Пользовательские агенты (ПА) должны отображать этот отступ как пробел.
Значения имеют следующий смысл:
Значение 'text-indent' может быть отрицательным, но могут быть ограничения, зависящие от реализации.
Пример(ы):
Отступ размером '3em' для текста.
P{text-indent: 3em}
| Значение: | left | right | center | justify | <string> | inherit |
| Начальное: | зависит от ПА и направления письма |
| Применяется: | к элементам уровня блока |
| Наследуется: | да |
| Процентное: | N/a |
| Носитель: | визуальный |
Это свойство описывает, как выравнивается инлайн-содержимое блока.
Значения имеют следующий смысл:
Блок текста это стопка строчных боксов. В случаях 'left', 'right' и 'center', это свойство специфицирует, как инлайн-боксы в каждом строчном боксе выравниваются относительно левой и правой сторон строчного бокса; выравнивание не производится относительно порта просмотра. В случае с 'justify', ПА может сжать инлайн-боксы в дополнение к уточнению их позиций. (См. также 'letter-spacing' и 'word-spacing'.)
Пример(ы):
Здесь обратите внимание, что, поскольку 'text-align' наследуется, все элементы уровня блока внутри элемента div с 'class=center' получат своё инлайн-содержимое сцентрированным.
div.center{text-align: center}
Примечание. Фактический алгоритм выравнивания по формату зависит от ПА и языка письма.
Соответствующие пользовательские агенты (ПА) могут интерпретировать значение 'justify' как 'left' или 'right', в зависимости от того, каково по умолчанию направление письма: слева-направо или справа-налево, соответственно.
16.3 Декоративные эффекты
| Значение: | none | [ underline || overline || line-through || blink ] | inherit |
| Начальное: | none |
| Применяется: | ко всем элементам |
| Наследуется: | нет (см. текст) |
| Процентное: | N/a |
| Носитель: | визуальный |
Это свойство описывает декоративное оформление текста элемента. Если это свойство специфицировано для элемента уровня блока, оно воздействует на всех потомков инлайн-уровня данного элемента. Если оно специфицировано (или влияет на) элемент инлайн-уровня, оно воздействует на все боксы, генерируемые элементом. Если элемент не имеет содержимого или текста (например, элемент img в HTML), ПА обязаны игнорировать данное свойство.
Значения имеют следующий смысл:
Цвет(а), необходимый для декорирования текста, должен быть получен из значения свойства 'color'.
Это свойство не наследуется, но боксы - потомки бокса блока должны быть сформатированы с тем же оформлением (например, все должны быть с подчёркиванием). Цвет оформления должен остаться тем же самым, даже если элементы-потомки имеют другие значения 'color'.
Пример(ы):
В следующем примере для HTML, текстовое содержимое всех элементов a будет подчёркнуто:
a[href]{text-decoration: underline}
Это свойство принимает список разделённых запятыми эффектов оттенения, применяемых к тексту элемента. Эффекты оттенения применяются в том порядке, в котором они специфицированы, и могут, таким образом, перекрываться один другим, но они никогда не перекрывают сам текст. Эффекты оттенения не изменяют размеры бокса, но могут выходить за его пределы. Уровень стэка эффекта оттенения - тот же самый, что и самого элемента.
Каждый эффект оттенения обязан специфицировать смещение оттенения и может по выбору специфицировать радиус рассеяния и цвет тени.
Смещение оттенения специфицируется 2 значениями <length>, указывающими расстояние от текста. Первое значение специфицирует расстояние по горизонтали справа от текста. Отрицательное значение по горизонтали помещает тень слева от текста. Второе значение специфицирует вертикальное расстояние под текстом. Отрицательное значение по вертикали помещает тень сверху от текста.
Радиус рассеяния может быть по выбору специфицирован после смещения оттенения. Радиус рассеяния это значение, обозначающее границы эффекта рассеяния. Точный алгоритм вычисления эффекта рассеяния не специфицирован.
Значение цвета может быть по выбору специфицировано до или после значений length эффекта оттенения. Значение цвета будет использоваться как базис эффекта оттенения. Если цвет не специфицирован, вместо него будет использоваться значение свойства 'color'.
Оттенения текста могут использоваться вместе с псевдоэлементами :first-letter и :first-line.
Пример(ы):
Следующий пример установит тень справа и снизу от текста элемента. Поскольку цвет не специфицирован, тень будет того же цвета, что и сам элемент, и, поскольку радиус рассеяния не специфицирован, тень текста не будет рассеиваться:
h1{text-shadow:.2em .2em}
Следующий пример установит тень справа и снизу от текста элемента. Тень будет иметь радиус рассеяния 5px и красный цвет:
h2{text-shadow: 3px 3px 5px red}
Следующий пример специфицирует список эффектов оттенения. Первая тень будет справа и снизу от текста элемента и будет красного цвета без рассеяния. Вторая тень будет перекрывать первую и будет жёлтая, с рассеянием и размещена влево и ниже текста. Третья тень будет справа и сверху над текстом. Поскольку у неё цвет не специфицирован, будет использоваться значение свойства 'color' элемента:
h2{text-shadow: 3px 3px red, yellow -3px 3px 2px, 3px -3px}
Пример(ы):
Рассмотри этот пример:
span.glow{background: white; color: white; text-shadow: black 0px 0px 5px;}
Здесь свойства 'background' и 'color' имеют одинаковые значения, и свойство 'text-shadow' используется для создания эффекта "солнечного затмения":
Примечание. Это свойство не определено в CSS1. Некоторые эффекты оттенения (такие как в последнем примере) могут делать текст невидимым в ПА, поддерживающих только CSS1.
| Значение: | normal | <length> | inherit |
| Начальное: | normal |
| Применяется: | ко всем элементам |
| Наследуется: | да |
| Процентное: | N/a |
| Носитель: | визуальный |
Это свойство специфицирует расстояние между символами текста.
Значения имеют следующий смысл:
Алгоритмы межсимвольного пространства независимы от ПА. Межсимвольное пространство может также устанавливаться при выравнивании по формату (см. свойство 'text-align').
Пример(ы):
В этом примере пространство между символами в элементах BLOCKQUOTE увеличено на '.1em'.
BLOCKQUOTE{letter-spacing:.1em}
В следующем примере ПАгенту не разрешено изменять межсимвольное пространство:
BLOCKQUOTE{letter-spacing:0}
Если расстояние-результат между 2 символами отличается от расстояния по умолчанию, ПА не должны использовать лигатуры.
Соответствующие ПА могут рассматривать значение свойства 'letter-spacing' как 'normal'.
| Значение: | normal | <length> | inherit |
| Начальное: | normal |
| Применяется: | ко всем элементам |
| Наследуется: | да |
| Процентное: | N/a |
| Носитель: | визуальный |
Это свойство специфицирует расстояние между словами.
Значения имеют следующий смысл:
Алгоритмы межсловного пространства зависят от ПА. Межсловное пространство устанавливается также при выравнивании по формату (см. свойство 'text-align').
Пример(ы):
Здесь пространство между словами в элементах h1 увеличено на '1em'.
h1{word-spacing: 1em}
Соответствующие ПА могут рассматривать значение свойство 'letter-spacing' как 'normal'.
| Значение: | capitalize | uppercase | lowercase | none | inherit |
| Начальное: | none |
| Применяется: | ко всем элементам |
| Наследуется: | да |
| Процентное: | N/a |
| Носитель: | визуальный |
Это свойство управляет эффектами капитализации текста элемента.
Значения имеют следующий смысл:
Реальная трансформация зависит в каждом конкретном случае от языка письма. См. о способах определения языка элемента в RFC 2070 ([RFC2070]).
Соответствующие ПА могут рассматривать значение 'text-transform' как 'none' для тех символов, которые не входят в репертуар Latin-1, и для элементов на тех языках, в которых трансформация отличается от трансформации, специфицированной таблицей конвертации регистров для ISO 10646 ([ISO10646]).
Пример(ы):
Здесь весь текст в элементе h1 переводится в верхний регистр.
h1{text-transform: uppercase}
| Значение: | normal | pre | nowrap | inherit |
| Начальное: | normal |
| Применяется: | к элементам уровня блока |
| Наследуется: | да |
| Процентное: | N/a |
| Носитель: | визуальный |
Это свойство объявляет, как обрабатываются пробелы внутри элемента.
Значения имеют следующий смысл:
Пример(ы):
Следующие примеры демонстрируют ожидаемое поведение пробелов в элементах pre и P и атрибута "nowrap" HTML.
pre{white-space: pre}P{white-space: normal}td[nowrap]{white-space: nowrap}
Соответствующие ПА могут игнорировать свойство 'white-space' в авторских и пользовательских таблицах стилей, но обязаны специфицировать для них значение в таблице стилей по умолчанию.
Отвечу на любые вопросы. С уважением, Дмитрий Владимирович.
⇪