columns
Поддержка браузерами
Описание
CSS свойство columns позволяет использовать значения свойств column-width и column-count в одном объявлении.
| Значение по умолчанию: |
auto auto |
| Применяется: |
к незамещаемым блочным или табличным элементам, к ячейкам таблицы или inline-block элементам |
| Анимируется: |
да, смотрите каждое свойство, входящее в состав краткого метода, отдельно |
| Наследуется: |
нет |
| Версия: |
CSS3 |
| Синтаксис JavaScript: |
object.style.columns="100px 3" |
Синтаксис
columns: auto|column-width column-count|inherit;
Значения свойства
| Значение |
Описание |
| column-width |
Ширина колонок. |
| column-count |
Количество колонок. |
| inherit |
Указывает, что значение наследуется от родительского элемента. |
Пример
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Пример</title>
<style>
.newspaper {
columns: 100px 3;
}
</style>
</head>
<body>
<div class="newspaper">
Стандарт CSS3 еще не принят, но многие полезные свойства уже поддерживаются большинством
браузеров. Из новых свойств стоит прежде всего обратить внимание на box-shadow и
text-shadow, который позволяют добавлять различные по виду и расположению тени, как
к тексту, так и к элементам, например можно сделать меню, отбрасывающую легкую тень,
для придания объемного вида. Еще одно из свойств предназначено для работы с
текстом - column, он позволяет делить текст на колонки, задавать ширину для них,
управлять расстоянием между колонками и выбирать стиль, ширину и цвет для
границ между ними.
</div>
</body>
</html>
Результат данного примера в окне браузера:
