Как выровнять картинку по горизонтали CSS

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

1. С помощью свойства display: flex. Для этого нужно задать свойство display: flex для контейнера, который содержит картинку, а затем свойство justify-content: center, чтобы выровнять картинку по горизонтали. Например:

.container {
  display: flex;
  justify-content: center;
}

img {
  /* дополнительные стили для картинки */
}

2. С помощью свойства text-align: center. Для этого нужно задать свойство text-align: center для контейнера, который содержит картинку. Например:

.container {
  text-align: center;
}

img {
  /* дополнительные стили для картинки */
}

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