Чтобы центрировать изображение по вертикали с помощью Bootstrap в HTML, вы можете использовать несколько методов:

Метод 1: Flexbox
Вы можете использовать Flexbox для вертикального центрирования изображения внутри контейнера. Вот пример:

<div class="d-flex align-items-center justify-content-center">
  <img src="your-image.jpg" alt="Your Image">
</div>

Метод 2: позиционирование CSS
Другой подход — использование позиционирования CSS. Установите относительное положение родительского контейнера, а затем используйте абсолютное позиционирование, чтобы центрировать изображение по вертикали:

<div >
  <img src="your-image.jpg" alt="Your Image">
</div>

Метод 3: CSS Grid
Если вы предпочитаете использовать CSS Grid, вы можете добиться вертикального центрирования с помощью следующего кода:

<div >
  <img src="your-image.jpg" alt="Your Image">
</div>

Метод 4: служебные классы Bootstrap
Bootstrap также предоставляет служебные классы для вертикального выравнивания. Вы можете использовать класс d-flexдля создания гибкого контейнера и класс align-items-centerдля центрирования изображения по вертикали:

<div class="d-flex align-items-center" >
  <img src="your-image.jpg" alt="Your Image">
</div>