Column count: column-count | htmlbook.ru

 body {columns: 2}
тело {columns: 12em}
тело {columns: 212em} 

Другая группа свойств, представленных в этом модуле, описывает промежутки и правила между столбцами.

 body {column-gap: 1em; column-rule: тонкий сплошной черный;} 

Первое объявление в приведенном выше примере устанавливает пробел между двумя соседними столбцами должно быть 1em. Промежутки столбцов аналогичны областям заполнения. В середине промежутка будет правило который описывается свойством column-rule.

Значения свойства column-rule аналогичны значениям свойств границы CSS. Как и граница, правило столбца - это сокращенное свойство.

 body {пробел-столбца: 1em; ширина-правила-столбца: тонкий; стиль-правила-столбца: сплошной; цвет правила-столбца: черный;} 

Свойства column-fill и column-span предоставить таблицам стилей более широкий диапазон визуальных выражений в многоколоночных макетах.

 div {column-fill: balance}
h3 {диапазон-столбцов: все} 

Эта спецификация вводит десять новых свойств, все они используются в приведенных выше примерах.

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

1.1. Определение значений

Эта спецификация следует соглашениям об определении свойств CSS из [CSS21] с использованием синтаксиса определения значений из [CSS-VALUES-3]. Типы значений, не определенные в этой спецификации, определены в CSS Values ​​& Units [CSS-VALUES-3]. Комбинация с другими модулями CSS может расширить определения этих типов значений.

В дополнение к значениям для конкретных свойств, перечисленным в их определениях, все свойства, определенные в этой спецификации также принимают ключевые слова CSS в качестве значения свойства.Для удобства чтения они явно не повторяются.

2. Многоколоночная модель

Элемент, для которого свойство column-width или column-count не установлено автоматически, устанавливает многоколоночный контейнер (или многоцветный контейнер для краткости), и поэтому действует как контейнер для многоколоночного макета.

В традиционной блочной модели CSS содержание элемента перетекала в поле содержимого соответствующего элемента. Многоколоночный макет вводит контекст фрагментации, образованный анонимными контейнерами фрагментации, называемыми столбцами (или столбцами для краткости).Эти поля столбцов устанавливают независимый контекст форматирования блока, в который перетекает содержимое контейнера с несколькими столбцами, и сформировать содержащий блок для его непозиционированных дочерних элементов.

 img {дисплей: блок; ширина: 100%;} 

Учитывая, что поле столбца создает новый контекст форматирования блока, ширина рассчитывается относительно поля столбца. Поэтому изображение не будет выходить за пределы поля столбца:

Поплавки, которые появляются внутри многоколоночных макетов, располагаются с относительно поля столбца, в котором появляется поплавок.

 img {display: block; float: right;} 

В HTML изображение появляется после окончания предложения «куриная ножка».

Содержимое выходит за пределы поля столбца во фрагментах оси блока и продолжается в поле следующего столбца.

Примечание: поля столбцов, которые являются анонимными ячейками, не становятся содержащим блоком для абсолютно позиционированных ящиков. Свойство position, которое устанавливает содержащий блок для таких ящиков, применяется к многоцветному контейнеру, являющемуся основным блоком.

 .container {position: relative; column-count: 3;}
img {position: absolute; top: 20px; left: 40px;} 

Ящики для колонн заказываются во внутреннем базовом направлении многоцветного контейнера и расположены в многоцветных линий .Ширина столбца - это длина поля столбца во внутреннем направлении. Высота столбца - это длина поля столбца в направлении блока. Все поля столбцов в строке имеют одинаковую ширину столбца, и все поля столбцов в строке имеют одинаковую высоту столбца.

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

В простейшем случае мультиколоный контейнер будет содержать только одну строку столбцов, а высота каждого столбца будет эквивалентна используемая высота поля содержимого контейнера с несколькими столбцами. Однако фрагментация или гаечные ключи могут разбить содержимое контейнера с несколькими столбцами на несколько строк с несколькими столбцами.

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

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

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

Разрешены вложенные многостолбцовые контейнеры, но могут быть ограничения, зависящие от реализации.

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

Примечание. Многоцветные контейнеры с высотой столбцов больше, чем область просмотра, могут создавать проблемы с доступом.

3. Число и ширина столбцов

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

Третье владение, колонны, - сокращенное свойство, которое устанавливает ширину столбца и количество столбцов.

Другие факторы, такие как явные разрывы столбцов, ограничения по содержимому и высоте, может повлиять на фактическое количество и ширину столбцов.

3.1. Встроенный размер столбцов: свойство ширины столбца

Это свойство описывает ширину столбцов в многоцветных контейнерах.

авто

означает, что ширина столбца будет определяться другими свойствами (например, количество столбцов, если у него неавтоматическое значение).

<длина [0, ∞]>

описывает оптимальную ширину столбца.Фактическая ширина столбца может быть шире (чтобы заполнить доступное пространство), или уже (только если доступное пространство меньше указанной ширины столбца). Отрицательные значения не допускаются. Используемые значения будут ограничены минимум 1 пикселем.

 div {width: 100px; column-width: 45px; column-gap: 0; column-rule: none;} 

Внутри элемента шириной 100 пикселей есть место для двух столбцов шириной 45 пикселей. Чтобы заполнить доступное пространство фактическая ширина столбца будет увеличена до 50 пикселей.

 div {width: 40px; column-width: 45px; column-gap: 0; column-rule: none;} 

Доступное пространство меньше указанной ширины столбца и поэтому фактическая ширина столбца будет уменьшена.

Чтобы гарантировать, что ширина столбца может использоваться с вертикальным текстом, Ширина столбца означает длину строк внутри столбцов.

Примечание. Причина, по которой ширина столбца должна быть несколько гибкой. заключается в создании масштабируемого дизайна, который может соответствовать разным размерам экрана.Чтобы установить точную ширину столбца, промежуток между столбцами и ширина многоцветного контейнера (при условии горизонтального текста) также необходимо указать.

3.2. Число столбцов: свойство подсчета столбцов

Это свойство описывает количество столбцов в многоцветном контейнере.

авто

означает, что количество столбцов будет определяться другими свойствами (например, ширина столбца, если у него неавтоматическое значение).

<целое [1, ∞]>

описывает оптимальное количество столбцов, в которые будет перетекать содержимое элемента.Значения должны быть больше 0. Если и ширина столбца, и счетчик столбцов имеют неавтоматические значения, целочисленное значение описывает максимальное количество столбцов.

 body {column-count: 3} 

3.3. Ширина и количество столбцов Сокращение: Свойство столбцов

Это сокращенное свойство для установки ширины столбца и количества столбцов. Пропущенные значения устанавливаются на свои начальные значения.

 столбцов: 12em; / * ширина столбца: 12em; количество столбцов: авто * /
columns: auto 12em; / * ширина столбца: 12em; количество столбцов: авто * /
столбцы: 2; / * ширина столбца: авто; количество столбцов: 2 * /
столбцы: 2 авто; / * ширина столбца: авто; количество столбцов: 2 * /
columns: auto; / * ширина столбца: auto; количество столбцов: авто * /
столбцы: авто авто; / * ширина столбца: авто; количество столбцов: авто * / 

3.4. Псевдо-алгоритм

Приведенный ниже псевдоалгоритм определяет используемые значения для количества столбцов (N) и ширины столбца (W). Есть еще одна переменная в псевдо-алгоритме: U - используемая ширина контейнера с несколькими столбцами.

Примечание: используемая ширина U многоколоночного контейнера может зависеть от содержимого элемента, в этом случае это также зависит от вычисленных значений свойств column-count и column-width. Эта спецификация не определяет, как рассчитывается U.Ожидается, что это будет определять другой модуль (возможно, базовая модель бокса [CSS3BOX] или модуль внутреннего и внешнего изменения размеров [CSS3-SIZING]).

Функция floor (X) возвращает наибольшее целое число Y ≤ X.

 (01) if ((column-width = auto) and (column-count = auto)), то
(02) выход; / * не многоцветный контейнер * /
(03) если ширина столбца = авто, то
(04) N: = количество столбцов
(05) иначе, если количество столбцов = авто, то
(06) N: = max (1,
(07) пол ((U + промежуток между столбцами) / (ширина столбца + промежуток между столбцами)))
(08) еще
(09) N: = min (количество столбцов, max (1,
(10) этаж ((U + промежуток между столбцами) / (ширина столбца + промежуток между столбцами))))
 

А:

 (11) W: = max (0, ((U + столбец-промежуток) / N - столбец-промежуток))
 

Для определения количества автоматически повторяющихся столбцов, UA должен уменьшить размер столбца до значения, указанного UA, чтобы избежать деления на ноль.Рекомендуется, чтобы этот пол был не более 1 пикселя.

В фрагментированных контекстах, например, в постраничных медиа, Пользовательские агенты могут выполнять это вычисление для каждого фрагмента.

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

 div {width: 40em; columns: 20em; column-gap: 0;}

p {break-after: column;} 

 
 
 один
  
 два
  
 три
 

 div {width: 80em; height: 10em; columns: 20em; column-gap: 0; column-fill: auto;} 

 
 foo 
 

Подсчет столбцов вычисляется автоматически, используемое количество столбцов - 4, а фактическое количество столбцов - 1.

3.5. Контекст стекирования

Все поля столбцов в контейнере с несколькими столбцами находятся в одном контексте наложения и порядок отрисовки их содержимого указан в CSS 2.1. Поля столбцов не устанавливают новый контекст наложения.

4. Пробелы в столбцах и правила

Промежутки столбцов и правила помещаются между столбцами в одном и том же многоцветном контейнере. Длина промежутков между столбцами и правил столбца равна высоте столбца. Промежутки между колонками занимают место. То есть промежутки между столбцами будут раздвигать содержимое в соседних столбцах. (в том же разноцветном контейнере).

Линия столбца рисуется в середине промежутка столбца с конечными точками на противоположных краях содержимого контейнера multicol.Правила столбца не занимают места. То есть наличие или толщина правила столбца не повлияет на размещение чего-либо еще. Если правило столбца шире, чем его промежуток, соседние поля столбцов будут перекрывать правило, и правило, возможно, может выходить за пределы коробки многоцветного контейнера. Правила столбцов нарисованы прямо над границей многоцветного контейнера. Для прокручиваемых многоцветных контейнеров обратите внимание, что хотя граница и фон многоцветного контейнера явно не прокручиваются, правила нужно прокручивать вместе со столбцами.Правила для столбцов рисуются только между двумя столбцами, в каждом из которых есть содержимое.

4.1. Желоба между столбцами: свойство зазора между столбцами

Свойство column-gap определено в [CSS3-ALIGN].

В контексте форматирования с несколькими столбцами используемое значение normal для свойства column-gap равно 1em. Это обеспечивает читаемость столбцов при использовании начальных значений. Если между столбцами есть правило столбца, он появится в середине промежутка.

4.2. Цвет правил столбца: свойство

<цвет>

Задает цвет правила столбца.

4.3. Стиль правил столбца: свойство

Свойство column-rule-style устанавливает стиль правила между столбцами элемента. Значения интерпретируются как в модели сворачивающейся границы.

Значение none заставляет вычисленное значение ширины правила столбца равняться 0.

4.4. Правила ширины столбца: свойство ширины правила столбца

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

4.5. Сокращение правила столбца: свойство правила столбца

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

 body {column-gap: 35px; column-rule-width: 35px; column-rule-style: solid; column-rule-color: black;} 

5. Разрывы столбцов

Когда контент размещен в нескольких столбцах, агент пользователя должен определить, где размещаются разрывы столбцов. Проблема разбиения содержимого на столбцы аналогична разбивке содержимого на страницы, который описан в CSS 2.1, раздел 13.3.3 [CSS21].

Введены три новых свойства, позволяющих описывать разрывы столбцов в тех же свойствах, что и разрывы страниц: разрыв до, разрыв после и разрыв внутри.

5.1. Контроль фрагментации: свойства взлома до, после, взлома

break-before, break-after и break-inside определены в [CSS3-BREAK].

6. Распределительные колонны

Свойство column-span позволяет элементу занимать несколько столбцов.

6.1. Распределение элемента по столбцам: свойство

Это свойство описывает, сколько столбцов занимает элемент. Значения:

нет

Элемент не занимает несколько столбцов.

все

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

Примечание: устанавливает ли элемент новый контекст форматирования, не зависит от того, является ли элемент потомком multicol или нет. Когда column-span - это все, так всегда бывает. Это помогает сделать дизайн более надежным для более поздних версий, в которых убирается многоцветность, или когда медиа-запросы в некоторых ситуациях отключают мультиколл.

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

Гаечный ключ становится вмещающим блоком для абсолютно расположенных ящиков внутри гаечного ключа. где остовный элемент устанавливает содержащий блок, в противном случае содержащая цепочка блоков переходит в контейнер multicol.

Перемычка выводится из потока, оставляя вынужденный разрыв. Это не влияет на порядок рисования [CSS21] связующего элемента.

 h3 {column-span: all; background: silver} 

Установив столбец для всех, весь контент, который появляется перед элементом h3 отображается перед элементом h3 .

Остовный элемент может быть ниже первого уровня потомков. если они являются частью одного контекста форматирования. Если фрагмент перед гаечным ключом пуст, ничего особенного не происходит; верхнее поле / граница / отступы находятся над охватывающим элементом как пустой фрагмент.

h3 - первый дочерний элемент секции. Это означает, что маржа, граница (показана красным на схеме) и заполнение в этом разделе появляется перед охватом h3 как пустой фрагмент.

 
...
  
 Элемент h3 
  
 ... 
 
 
 

 section {border: 2px сплошной красный; margin-top: 65px; padding-top: 20px;}

h3 {диапазон столбцов: все; фон: серебро
} 

Охватывающий элемент занимает больше места, чем в противном случае. Когда пространство ограничено, может быть невозможно найти место для перекрывающего элемента.В этих случаях пользовательские агенты могут обрабатывать элемент так, как если бы он не был указан в этом свойстве.

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

 h3 {margin: 16px0; диапазон столбцов: все; фон: серебро
}
p {margin-top: 16px} 

7. Заполнение колонн

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

7.1. Балансировка столбца: свойство заполнения столбца

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

остаток

По возможности равномерно распределите содержимое между столбцами.В фрагментированных контекстах сбалансирован только последний фрагмент.

остаток

По возможности равномерно распределите содержимое между столбцами. В фрагментированных контекстах все фрагменты сбалансированы.

авто

заполнять столбцы последовательно

В непрерывном контексте это свойство не имеет никакого эффекта при наличии столбцов переполнения.

 article {width: 60em; height: auto; columns: 4; column-fill: balance;} 

 article {width: 60em; height: 4em; columns: 4; column-fill: auto;} 

В результате первый столбец заполняется всем содержимым:

 article {width: 60em; height: auto; columns: 4; column-fill: balance;}

p {break-after: column;} 

Наименьшая возможная высота столбца содержит пять строк текста. После того, как высота столбца установлена, столбцы заполняются последовательно. В результате высота третьего столбца равна высоте первых двух столбцов, в то время как последний столбец оказывается значительно короче.

 article {width: 60em; height: auto; columns: 4; column-fill: balance;} 

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

8. Перелив

8.1. Перелив внутри многоцветных контейнеров

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

Примечание. См. Раздел 5 «Разрывы столбцов» для получения информации о разрывах столбцов и §8.2 Разбивка на страницы и переполнение за пределами многоцветных контейнеров для определения того, прирезается ли он к блоку содержимого многоколоночного контейнера.

8,2. Пагинация и переполнение за пределами многоцветных контейнеров

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

В многоцветном контейнере может быть больше колонн, чем вмещается из-за:

• объявление, ограничивающее высоту столбца (например, используя высоту или максимальную высоту). В этом случае дополнительные поля столбцов создаются во внутреннем направлении.
• размер страницы. В этом случае дополнительные поля столбцов перемещаются на следующие страницы.
• явный разрыв столбца. В этом случае дополнительные поля столбцов создаются во внутреннем направлении для непрерывных контекстов. и дополнительные поля столбцов перемещаются к следующему фрагменту (фрагментам) для фрагментированного носителя.

Столбцы, которые появляются вне многоцветного контейнера в непрерывном контексте называются столбцами переполнения . Столбцы переполнения могут повлиять на высоту многоцветного контейнера.

 div {max-height: 5em; overflow: visible;} 

В результате количество столбцов увеличено.

В непрерывном контексте столбцы переполнения могут влиять на высоту многоцветного контейнера. В этом примере в переполнении появляется столбец с четырьмя строками текста. Многоцветный контейнер делают достаточно высоким, чтобы вместить эту колонну.

Предполагая балансировку столбцов, это будет отображаться на второй странице:

 p {break-after: column;} 

В результате количество столбцов увеличивается, а дополнительные столбцы добавляются во внутреннем направлении:

Это появится на второй странице:

Из-за балансировки столбцов последний абзац разделен на три столбца.

Приложение B. Изменения

Это приложение информационное .

Изменения из рабочего проекта (WD) от 15 октября 2019 г.

• Добавлен текст «Гаечный ключ становится содержащим блоком для абсолютно позиционированных ящиков внутри гаечного ключа, где охватывающий элемент устанавливает содержащий блок, в противном случае содержащая цепочка блоков переходит в контейнер multicol.». Решено 23 окт.2020 г.
• Добавление текста «Это свойство указывает, в строке с несколькими столбцами, в которой , а не , непосредственно предшествует гаечному ключу сбалансировано по столбцам или нет."Решено 29 апреля 2020 г.

Изменения из рабочего проекта (WD) от 28 мая 2018 г.

• Удален ненормативный текст. «Однако, как описано ниже, установка ширины и количества столбцов редко имеет смысл». От редакции 16 сентября 2019 г., выпуск 4291.
• Добавлен абзац «Гаечные ключи - блоки блочного уровня. поэтому края двух смежных гаечных ключей сожмутся друг с другом. Поскольку поля столбцов устанавливают новый контекст форматирования блока, поля на элементах внутри поля столбца не исчезнут с полем гаечного ключа."Решение принято 22 октября 2018 г., см. Также решение по вопросу 2582.
• Уточнена спецификация, поясняющая, что перекрывающий элемент выводится из потока, оставляя принудительный разрыв. Добавлен абзац: «Охватывающий элемент выводится из потока, оставляя принудительный разрыв. Это не влияет на порядок рисования связующего элемента». Решено 28 февраля 2019 г.
• Определение свойства column-gap перемещено в [CSS3-ALIGN] и добавлен абзац, подробно описывающий особенности column-gap в multicol:
  «В контексте форматирования с несколькими столбцами используемое значение normal для column-gap свойство 1em.Это обеспечивает читаемость столбцов при использовании начальных значений. Если между столбцами есть правило столбца, оно появится в середине промежутка ». Решение принято 4 июня 2019 г.
• Изменил формулировку раздела Модель с несколькими столбцами на основе данных Мортена Стенсхорна в выпуске 2203.
• Удален маркер риска из значения длины в процентах для зазора столбца. Решено 4 июня 2019 г.
• Обновлено введение, чтобы убрать упоминание о преимуществах многоцветного изображения перед использованием таблиц для разметки и вместо этого указать на уникальные характеристики многоцветного изображения.Редакционное изменение, упомянутое в выпуске 3654.
• Изменено предложение, добавленное в раздел псевдо-алгоритма после разрешения от 7 января 2016 года, чтобы оно относилось к столбцам , а не дорожкам , поскольку дорожки не определены в этой спецификации. Решено 13 марта 2019 г.
• Изменения и пояснения к изображениям SVG, используемым в спецификации.
• Изменен синтаксис для использования обозначения диапазона в квадратных скобках, чтобы отразить прозаические ограничения на отрицательные / ненулевые значения.

Изменения из рабочего проекта (WD) от 5 октября 2017 г.

• Изменены ссылки на мультимедийные данные с разбивкой на страницы для ссылки на фрагментированные контексты. Решение решено 12 апреля 2018 г.
• Изменена строка, относящаяся к свойству заполнения столбца :
  В непрерывном носителе это свойство не влияет на столбцы переполнения.
  Кому:
  В непрерывном носителе это свойство не действует при наличии столбцов переполнения. Решено: 12 апр 2018 г.
• Добавьте строку текста и пример, чтобы показать, что столбцы переполнения могут влиять на высоту многоцветного контейнера.Решено: 12 апреля 2018 г.
• Заменены примеры макетов HTML версиями SVG, так как примеры были нечеткими. Проблема 1087.
• Изменил значение normal для column-gap на 1em, а не на длину, заданную UA, предложив 1em. Решено: 4 апр 2018 г.
• Разъяснено, что отрицательные значения не допускаются для ширины столбца и что, хотя можно указать 0, используемые значения будут ограничены минимум 1 пикселем. Решено: 14 марта 2018 г.
• Пояснено, что при наличии охватывающего элемента содержимое автоматически балансируется по всем столбцам в строке непосредственно предшествующего столбца перед появлением элемента.Решено: 9 ноября 2017 г.
• Добавлено пояснение и дополнительный пример того, что охватывающие элементы могут быть ниже первого уровня потомков, и что в случае полей, границ и отступов на элементе, содержащем охват, они будут нарисованы над гаечным ключом. Решено: 8 ноября 2017 г.
• Изменено предложение Правила столбцов отображаются на уровне встроенного содержимого, но ниже всего встроенного содержимого внутри элемента multicol. С по Правила столбцов отображаются чуть выше границы элемента multicol.Для прокручиваемых многоцветных элементов обратите внимание, что хотя граница и фон многоцветного элемента, очевидно, не прокручиваются, правила должны прокручиваться вместе со столбцами. Решено: 7 нояб.2017 г.
• В разделе Модель с несколькими столбцами удалены два предложения. То есть поля столбцов ведут себя как блоки уровня блока, ячейки таблицы и встроенные блоки в соответствии с CSS 2.1, раздел 10.1, элемент 2 CSS21. Однако поля столбцов не устанавливают блоки контейнеров блоков для элементов с position: fixed или position: absolute.. Они были заменены разъяснением основного блока и новым примером, показывающим, как элементы abspos относятся к контейнеру multicol. Решено: 7 ноября 2017 г.
• Удалено предложение «Чтобы указать, где должны (или не должны) появляться разрывы столбцов, вводятся новые значения ключевых слов». и следующий пример (Пример 7 в WD, опубликованном 5 октября 2017 г.), поскольку спецификация multicol больше не вводит эти свойства. Редакционная
• Изменен способ ссылки на элемент, к которому мы применили multicol, с многоколоночного или многоцветного элемента на многоколоночный или мультиколоночный контейнер .Решено: 22 ноября 2017 г.
• Удален пример, в котором говорилось: «Если высокое изображение перемещается в столбец на следующей странице, чтобы найти для него место, его естественный столбец может быть оставлен пустым. Если это так, столбец по-прежнему считается имеющим содержимое для целей решая, следует ли рисовать правило столбца ". Решено: 7 сентября 2017 г.

Изменения по сравнению с Рекомендацией кандидата (CR) от 12 апреля 2011 г.

Вопросы конфиденциальности и безопасности

Multicol не представляет новых утечек конфиденциальности, или соображения безопасности помимо «правильно реализовать».

Благодарности

Этот документ основан на нескольких более старых предложениях и комментариях к более ранним предложениям. Среди авторов:

Могилевский Алексей, Энди Кларк, Антон Проуз, Берт Бос, Бьорн Хёрманн, Седрик Саварезе, Крис Лилли, Крис Уилсон, Дэниел Глазман и Дэйв Рэггетт, Дэвид Хаятт, Дэвид Сингер, Дэвид Вулли, Элика Этемад, Джованни Кампанья, Ян Хиксон. Йост де Валк, Кевин Ловер, Л. Дэвид Барон, Маркус Мильке, Мелинда Грант, Майкл Дэй, Мортен Стенсхорн, Эйвинд Стенхауг, Питер Линсс, Питер-Пауль Кох, Роберт О’Каллахан, Роберт Стеван, Сергей Генкин, Шелби Мур, Стив Зиллес, Сильвен Галино, Тантек Челик, Тиль Хальбах

Требования к соответствию выражаются комбинацией описательные утверждения и терминология RFC 2119.Ключевые слова «ДОЛЖНЫ», «НЕ ДОЛЖЕН», «ОБЯЗАТЕЛЬНО», «ДОЛЖЕН», «НЕ ДОЛЖЕН», «ДОЛЖЕН», «НЕ ДОЛЖЕН», «РЕКОМЕНДУЕТСЯ», «МОЖЕТ» и «ДОПОЛНИТЕЛЬНО» в нормативных частях настоящего документ следует интерпретировать, как описано в RFC 2119. Однако для удобства чтения эти слова не отображаются в верхнем регистре. буквы в этой спецификации.

Весь текст данной спецификации является нормативным, кроме разделов явно помечены как ненормативные, примеры и примечания. [RFC2119]

Примеры в этой спецификации представлены словами «например» или выделены отдельно от нормативного текста с помощью class = "example" , примерно так:

Информационные заметки начинаются со слова «Примечание» и выделяются нормативный текст с class = "note" , например:

Примечание, это информационное примечание.

Рекомендации - это нормативные разделы, призванные привлечь особое внимание. отделить от другого нормативного текста кодом , например это: UA ДОЛЖНЫ предоставлять доступную альтернативу.

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

Средство визуализации соответствует этой спецификации если в дополнение к интерпретации таблицы стилей, как определено соответствующие спецификации, он поддерживает все определенные функции по этой спецификации, правильно проанализировав их и соответствующим образом отрисовываем документ.Однако неспособность UA для корректной визуализации документа из-за ограничений устройства не делает UA несоответствующим. (Например, UA не требуется для воспроизведения цвета на монохромном мониторе.)

Инструмент разработки соответствует этой спецификации. если он пишет синтаксически правильные таблицы стилей в соответствии с общая грамматика CSS и отдельные грамматики каждой функции в этот модуль и соответствовать всем остальным требованиям соответствия таблиц стилей как описано в этом модуле.

Чтобы авторы могли использовать правила синтаксического анализа с прямой совместимостью, чтобы назначать резервные значения, средства визуализации CSS должны обрабатывать как недопустимые (и игнорировать при необходимости) любые правила, свойства, значения свойств, ключевые слова, и другие синтаксические конструкции, для которых у них нет пригодного уровня служба поддержки. В частности, пользовательские агенты не должны выборочно игнорировать неподдерживаемые значения компонентов и соблюдать поддерживаемые значения в одном объявление многозначного свойства: если какое-либо значение считается недопустимым (поскольку должны быть неподдерживаемые значения), CSS требует, чтобы все объявление игнорировать.