Как отзеркалить картинку в CSS

Чтобы отразить (зеркально отобразить) картинку в CSS, можно использовать свойство transform. Свойство scaleX(-1) отразит картинку по горизонтали.

Например, если ваша картинка имеет класс .my-image, то вы можете отразить ее следующим образом:

.my-image {
  transform: scaleX(-1);
}

Если вы хотите отразить картинку прямо в HTML коде, вы можете использовать атрибут style и добавить свойство transform: scaleX(-1):

<img src="my-image.png" style="transform: scaleX(-1)">

В обоих случаях картинка будет отображаться зеркально. Вы можете изменять значение scaleX (например, scaleX(-2), чтобы увеличить масштаб зеркального отображения).

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как отзеркалить картинку в CSS

Наш специалист свяжется с вами в ближайшее время и уточнит детали