column-gap
Поддержка браузерами
12.0+ | 10.0+ |
Описание
CSS свойство column-gap определяет расстояние между колонками.
Если используется свойство column-rule - видимая граница между колонками, она будет отображаться в середине расстояния между колонками.
Значение по умолчанию: | normal |
---|---|
Применяется: | к многоколоночным элементам |
Анимируется: | нет |
Наследуется: | нет |
Версия: | CSS3 |
Синтаксис JavaScript: | object.style.columnGap="40px" |
Синтаксис
column-gap: расстояние|normal|inherit;
Значения свойства
Значение | Описание |
---|---|
расстояние | Расстояние между колонками указывается в единицах измерения CSS. |
normal | Указывает стандартный интервал между колонками. W3C предполагает значение 1em. |
Пример
CSS Свойство:
column-gap:
Результат:
Стандарт CSS3 еще не принят, но многие полезные свойства уже поддерживаются большинством браузеров. Из новых свойств стоит прежде всего обратить внимание на box-shadow и text-shadow, который позволяют добавлять различные по виду и расположению тени, как к тексту, так и к элементам, например можно сделать меню, отбрасывающую легкую тень, для придания объемного вида. Еще одно из свойств предназначено для работы с текстом - column, он позволяет делить текст на колонки, задавать ширину для них, управлять расстоянием между колонками и выбирать стиль, ширину и цвет для границ между ними.
CSS Код:
div {
column-count: 3;
column-gap: 1px;
}
column-count: 3;
column-gap: 1px;
}