Свойство justifyContent
Пример style.justifyContent
Оставьте немного места между элементами гибкого элемента <div>:
document.getElementById("main").style.justifyContent = "space-between";
Попробуйте сами »
Описание justifyContent
Свойство justifyContent выравнивает элементы гибкого контейнера, когда элементы не используют все доступное пространство на главной оси (по горизонтали).
Совет: Используйте свойство alignContent для выравнивания элементов по поперечной оси (по вертикали).
Поддержка justifyContent
| Свойство | |||||
|---|---|---|---|---|---|
| justifyContent | Да | 12.0 | Да | 9.0 | Да |
Синтаксис justifyContent
Вернуть свойство justifyContent:
object.style.justifyContent
Установите свойство justifyContent:
object.style.justifyContent = "flex-start|flex-end|center|space-between|space-around|initial|inherit"
Значение свойства justifyContent
| Значение | Описание |
|---|---|
| flex-start | Значение по умолчанию. Элементы располагаются в начале контейнера. |
| flex-end | Элементы располагаются в конце контейнера. |
| center | Элементы располагаются в центре контейнера. |
| space-between | Элементы располагаются с пробелами между строками. |
| space-around | Элементы размещаются с пробелами до, между и после строк. |
| initial | Устанавливает это свойство в значение по умолчанию. Читайте о initial |
| inherit | Наследует это свойство от родительского элемента. Читайте о inherit |
Технические детали justifyContent
| Значение по умолчанию: | flex-start |
|---|---|
| Возвращаемое значение: | Строка, представляющая свойство justify-content элемента. |
| CSS Версия | CSS3 |
Связанные страницы justifyContent
CSS Справочник: Свойство justify-content
HTML DOM STYLE Справочник: Свойство alignContent
HTML DOM STYLE Справочник: Свойство alignItems
HTML DOM STYLE Справочник: Свойство alignSelf