• Страница 1 из 1
  • 1
Форум » Web-Раздел » Начинающему вебмастеру » Равномерно распределенные элементы в CSS (Как сделать равномерно распределенные элемента с помощью CSS)
Равномерно распределенные элементы в CSS
Kosten
Дата: Суббота, 2019-05-04, 22:22 | Сообщение 1
Администраторы
Сообщений:21624
Награды: 56


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

Модуль CSS Flexible Box

[info]Метод размещения элементов в горизонтальных или вертикальных стопках. Поддержка включает в себя все свойства с префиксом flex, а также display: flex, display: inline-flex, align-content, align-items, align-self, justify-contentи order.[/info]

HTML

Код
<div class="leguide_kaineve_savin">
  <p>Начинающему вебмастеру #1</p>
  <p>Начинающему вебмастеру #2</p>
  <p>Начинающему вебмастеру #3</p>
</div>

CSS

Код
.leguide_kaineve_savin {
  display: flex;
  justify-content: space-between;
}


1. display: flex включает flexbox.
2. justify-content: space-between равномерно распределяет дочерние элементы по горизонтали. Первый элемент расположен на левом краю, а последний элемент идет на правом краю.
Кроме того, используйте justify-content: space-around для распределения детей с пространством вокруг них, а не между ними.

Демонстрация
Прикрепления: dsanyrsa.zip(1.4 Kb)
Страна: (RU)
Форум » Web-Раздел » Начинающему вебмастеру » Равномерно распределенные элементы в CSS (Как сделать равномерно распределенные элемента с помощью CSS)
  • Страница 1 из 1
  • 1
Поиск: