CSS2 определяет следующие группы носителей :
[x]. непрерывныеили страничные. "Оба" означает, что свойство применяется к обеим группам носителей.
[x]. визуальные, звуковыеили осязательные.
[x]. решётка (для устройств с решётками символов) или растровые. "Оба" означает, что свойство применяется к обеим группам носителей.
[x]. интерактивные(для устройств, взаимодействующих с пользователем или статичные(для не взаимодействующих). "Оба" означает, что свойство применяется к носителям обеих групп.
[x]. все(включает все типы носителей).
В следующей таблице показаны соотношения между группами носителей и типами носителя:
Соотношения между группами носителя и типами носителя
Типы носителя |
Группы носителей |
непрерывный / страничный |
визуальный / звуковой / осязательный |
решётка / растровый |
интерактивный / статичный |
звуковой |
непрерывный |
звуковой |
N/A |
оба |
брайль-устройство |
непрерывный |
осязательный |
решётка |
оба |
брайль-принтер |
страничный |
осязательный |
решётка |
оба |
портативный |
оба |
визуальный |
оба |
оба |
печатный |
страничный |
визуальный |
растровый |
статичный |
проектор |
страничный |
визуальный |
растровый |
статичный |
экран |
непрерывный |
визуальный |
растровый |
оба |
tty |
непрерывный |
визуальный |
решётка |
оба |
tv |
оба |
визуальный , звуковой |
растровый |
оба |
Описывается модель бокса, свойства полей бокса, заполнения бокса и его рамок.
Модель бокса CSS описывает прямоугольный бокс, который генерируется для элементов дерева документа и располагается в соответствии с моделью визуального форматирования. Страничный боксэто особый вид бокса, детально описанный в разделе страничный носитель.
Каждый бокс имеет область содержимого(например, текст, изображение и т.п.) и необязательное окружение - области заполнения , рамки и поля ; размер каждой области специфицируется свойствами, определёнными ниже. На диаграмме показано соотношение этих областей и терминология, используемая для ссылок на разные участки поля /margin, рамки/border и заполнения /padding:
[D]
Поле , рамка и заполнение могут быть разорваны в левом, правом, верхнем или нижнем сегментах (например, на диаграмме, "LM" в левом поле, "RP" в правом заполнении, "TB" в верху рамки и т.д.).
Периметр каждой из четырёх областей (содержимого, заполнения , рамки и поля ) называется "край", соответственно - каждый бокс имеет четыре края:
content edge/ край содержимого или inner edge/ внутренний край
Край содержимого окружает отображаемое содержимое.
padding edge/ край заполнения
Окружает заполнение бокса . Если заполнение имеет ширину 0, край заполнения - это то же, что и край содержимого . Край заполнениябокса определяет края содержащего блока, установленного боксом.
border edge/ край рамки
Окружает рамку бокса . Если рамка имеет ширину 0, то край рамки - это то же, что и край заполнения .
margin edge/ край поля или outer edge/ внешний край
Окружает поле бокса. Если поле имеет ширину 0, то край поля - тот же, что и край рамки .
Каждый край может быть разорван слева, справа, вверху и внизу.
Размеры области содержимого бокса- ширина содержимого и высота содержимого - зависят от нескольких факторов: имеет ли элемент, генерирующий бокс, установленные свойства 'width' или 'height', содержит ли бокс текст или другие боксы, является ли бокс таблицей и т.д. Ширина и высота бокса обсуждаются в главе некоторые детали модели визуального форматирования.
Ширина бокса выводится как сумма левого и правого поля , рамки, заполнения и ширины содержимого. Высота выводится как сумма верхнего и нижнего поля , рамки, заполнения и высоты содержимого .
Читать дальше