В Bootstrap 4 класс «align-items» используется для управления вертикальным выравниванием элементов флексбокса внутри контейнера. Вот несколько методов, которые можно использовать для выравнивания элементов в Bootstrap 4:

1. Использование служебного класса «align-items». Вы можете применить к контейнеру классы «align-items-start», «align-items-center» или «align-items-end» для выравнивания. элементы в верхнюю, центральную или нижнюю часть контейнера соответственно.

<div class="d-flex align-items-start">
  <!-- Your flexbox items here -->
</div>

2. Использование служебного класса «align-self»: ​​вы можете применить классы «align-self-start», «align-self-center» или «align-self-end» непосредственно к элементам флексбокса, чтобы выровнять их. индивидуально внутри контейнера.

<div class="d-flex">
  <div class="align-self-start">Item 1</div>
  <div class="align-self-center">Item 2</div>
  <div class="align-self-end">Item 3</div>
</div>

3. Использование пользовательского CSS. Вы также можете написать собственный CSS для выравнивания элементов. Например, вы можете использовать свойство align-items непосредственно в контейнере или использовать свойство align-self для отдельных элементов.

<style>
  .custom-container {
    display: flex;
    align-items: flex-start;
  }

  .custom-item {
    align-self: center;
  }
</style>
<div class="custom-container">
  <div class="custom-item">Item 1</div>
  <div class="custom-item">Item 2</div>
  <div class="custom-item">Item 3</div>
</div>