Выбрать главу

Рассмотри этот пример:

SPAN.glow { background: white; color: white; text-shadow: black 0px 0px 5px; }

Здесь свойства 'background' и 'color' имеют одинаковые значения, и свойство 'text-shadow' используется для создания эффекта "солнечного затмения":

[D]

Примечание. Это свойство не определено в CSS1. Некоторые эффекты оттенения (такие как в последнем примере) могут делать текст невидимым в ПА, поддерживающих только CSS1.

'letter-spacing'

Значение: normal | <length> | inherit

Начальное: normal

Применяется: ко всем элементам

Наследуется: да

Процентное: N/A

Носитель: визуальный

Это свойство специфицирует расстояние между символами текста. Значения имеют следующий смысл:

normal

Нормальное расстояние для текущего шрифта. Это значение позволяет ПА изменять расстояние между символами при выравнивании и распределении текста.

<length>

Обозначает межсимвольное пространство, дополнительное к значению по умолчанию. Значения могут быть отрицательными, но могут иметься ограничения в конкретных реализациях. ПА могут не иметь после этого возможности изменять межсимвольное пространство для распределения и выравнивания текста.

Алгоритмы межсимвольного пространства независимы от ПА. Межсимвольное пространство может также устанавливаться при выравнивании по формату (см. свойство 'text-align').

В этом примере пространство между символами в элементах BLOCKQUOTE увеличено на '0.1em'.

BLOCKQUOTE { letter-spacing: 0.1em }

В следующем примере ПАгенту не разрешено изменять межсимвольное пространство:

BLOCKQUOTE { letter-spacing: 0cm } /* То же, что '0' */

Если расстояние-результат между двумя символами отличается от расстояния по умолчанию, ПА не должны использовать лигатуры.

Соответствующие ПА могут рассматривать значение свойства 'letter-spacing' как 'normal'.

'word-spacing'

Значение: normal | <length> | inherit

Начальное: normal

Применяется: ко всем элементам

Наследуется: да

Процентное: N/A

Носитель: визуальный

Это свойство специфицирует расстояние между словами. Значения имеют следующий смысл:

normal

Нормальное межсловное пространство, как определено текущим шрифтом и/или ПА.

<length>

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

Алгоритмы межсловного пространства зависят от ПА. Межсловное пространство устанавливается также при выравнивании по формату (см. свойство 'text-align').

Здесь пространство между словами в элементах H1 увеличено на '1em'.

H1 { word-spacing: 1em }

Соответствующие ПА могут рассматривать значение свойства word-spacing' как 'normal'.

'text-transform'

Значение: capitalize | uppercase | lowercase | none | inherit

Начальное: none

Применяется: ко всем элементам

Наследуется: да

Процентное: N/A

Носитель: визуальный

Это свойство управляет эффектами капитализации текста элемента. Значения имеют следующий смысл:

capitalize

Переводит первый символ каждого слова в верхний регистр.

uppercase

Переводит все символы каждого слова в верхний регистр.

lowercase

Переводит все символы каждого слова в нижний регистр.

none

Нет эффектов капитализации.

Реальная трансформация зависит в каждом конкретном случае от языка письма. См. о способах определения языка элемента в RFC 2070 ( [RFC2070] ).

Соответствующие ПА могут рассматривать значение 'text-transform' как 'none' для тех символов, которые не входят в репертуар Latin-1, и для элементов на тех языках, в которых трансформация отличается от трансформации, специфицированной таблицей конвертации регистров для ISO 10646 ( [ISO10646] ).

Здесь весь текст в элементе H1 переводится в верхний регистр.

H1 { text-transform: uppercase }

'white-space'

Значение: normal | pre | nowrap | inherit

Начальное: normal

Применяется: к элементам уровня блока

Наследуется: да

Процентное: N/A

Носитель: визуальный

Это свойство объявляет, как обрабатываются пробелы внутри элемента. Значения имеют следующий смысл:

normal

Это значение указывает ПАгентам, что нужно сжимать последовательности пробелов и что нужны разрывы строк для заполнения строк бокса. Дополнительные разрывы строк могут создаваться с помощью ввода "\A" в генерируемом содержимом (например, для элемента BR в HTML).

pre

Это значение предотвращает сжатие ПАгентами последовательностей пробелов. Строки переносятся только в коде документа или при появлениях "\A" в генерируемом содержимом.

nowrap

Это значение сжимает пробелы, как 'normal', но подавляет разрывы строк в тексте, за исключением тех, которые создаются "\A" в генерируемом содержимом (например, для элемента BR в HTML).

Следующие примеры демонстрируют ожидаемое поведение пробелов в элементах PRE и P и атрибута "nowrap" HTML.

PRE { white-space: pre } P { white-space: normal } TD[nowrap] { white-space: nowrap }

Соответствующие ПА могут игнорировать свойство 'white-space' в авторских и пользовательских таблицах стилей, но обязаны специфицировать для них значение в таблице стилей по умолчанию.

Лекция 17. Таблицы

Описывается табличная модель CSS и ее визуальное форматирование.

Таблицы представляют взаимоотношения между данными. Авторы специфицируют эти взаимоотношения на языке документа и их представление в CSS двумя способами - визуально и звуком.

Авторы могут специфицировать визуальное форматирование таблицы как прямоугольной сетки ячеек. Ряды и столбцы ячеек можно организовать в группы рядов и столбцов. Ряды, столбцы, группы рядов, группы столбцов и ячейки могут иметь вокруг себя прорисованные рамки (в CSS2 есть две модели рамок). Авторы могут выровнять данные в ячейках по вертикали и по горизонтали и выровнять данные во всех ячейках ряда или столбца.

Авторы могут также специфицировать звуковое представление таблицы: то, как заголовки и данные будут звучать. На языке документа авторы могут помечать лэйблами ячейки и группы ячеек так, что при звуковом отображении заголовки ячеек будут произноситься перед данными ячеек. Фактически это "сериализует" таблицу: пользователи, прослушивающие таблицу, услышат последовательность заголовков и последующих данных.

Вот простая таблица из трёх рядов и трёх столбцов, написанная в HTML 4.0:

<TABLE> <CAPTION>Это простая таблица 3x3</CAPTION> <TR id="row1"> <TH>Header 1 <TD>Cell 1 <TD>Cell 2 <TR id="row2"> <TH>Header 2 <TD>Cell 3 <TD>Cell 4 <TR id="row3"> <TH>Header 3 <TD>Cell 5 <TD>Cell 6 </TABLE>

Этот код создаёт одну таблицу (элемент TABLE), три ряда (элементы TR), три заголовочных ячейки (элементы TH) и шесть ячеек данных (элементы TD). Обратите внимание, что три столбца в этом примере специфицированы неявно: в таблице столько столбцов, сколько затребовано заголовочными ячейками и ячейками данных.