English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Руководство по CSS

Правила CSS (RULES)

Полный список свойств CSS

Метод использования и примеры для свойства column-width в CSS3

Свойство column-width CSS определяет оптимальную ширину колонок для элементов с несколькими колонками. Это не абсолютное значение, браузер может adjusts ширину колонок в зависимости от значений других свойств, особенноcolumn-count.

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

Значение по умолчанию:auto
Применяется к:Не заменяемыйБлочныйЭлемент (за исключением таблицевых элементов), ячейка иВложенный блокЭлемент
Инherit:Нет
Анимировано:Да.См. также: Анимационные свойства.
Версия: Новые функции CSS3
JavaScript грамматика:object.style.columnWidth="100px"

Грамматика использования column-width

Грамматика этого свойства такая:

column-width:　length　|　auto　|　initial　|　inherit

Ниже приведен пример использования свойства column-width.

p　{
　　　　-webkit-column-width:　150px;　/*　Chrome,　Safari,　Opera　*/
　　　　　　　-moz-column-width:　150px;　/*　Firefox　*/
　　　　　　　　　　　　column-width:　150px;　
}
Проверьте, ›/‹

Значения свойств

В таблице ниже описаны значения этого свойства.

ЗначениеОписание
length

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

autoШирина колонки определяется другими свойствами многостраничного элемента, например column-Count. Это значение по умолчанию.
initialУстановить этот параметр в его значение по умолчанию.
inheritЕсли указано, то связанный элемент использует значение свойства column-width родительского элемента.

Совместимость браузеров

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

  • Firefox 2+ -moz-

  • Google Chrome 4+ -webkit-

  • Internet Explorer 10+

  • Apple Safari 3.1+ -webkit-

  • Opera 11.1+ -o-, 15+ -webkit-

Дополнительное чтение

Узнайте больше из следующих руководств:CSS3 многостраничное макетирование.

Связанные свойства:column-span,column-fill,column-gap,column-rule,column-rule-color,column-rule-style,column-rule-width,column-count,columns.

Свойство columns в CSS3Свойство column-span в CSS3