Фоновое изображение повернуто - почему? - PullRequest
0 голосов
/ 05 ноября 2018

На странице: https://legionhdk.pl/profil-krwiodawcy/donacje/donacja/3406-robert-kowalewski-08-09-2018 есть div с изображением: https://legionhdk.pl/images/leg/donacje/752-IMG-3273.JPG в фоновом режиме:

.foto {
  width:200px;
  height:200px;
  background-size:contain;
}
<div class="foto" style="background-image:url('https://legionhdk.pl/images/leg/donacje/752-IMG-3273.JPG')"></div>

Когда я открываю изображение в любом браузере, оно выглядит нормально, но когда оно в фоновом режиме, оно поворачивается. Вопрос почему? Некоторые фотографии в этом месте в порядке, но некоторые из них повернуты.

1 Ответ

0 голосов
/ 05 ноября 2018

Они вводят здесь метаданные изображения:

image

Когда вы поворачиваете фотографию с помощью приложения iOS Photos, оно фактически не поворачивает само изображение. Вместо этого он устанавливает флаг в метаданных, чтобы сказать «это изображение было повернуто». Хотя некоторые браузеры теперь достаточно умны, чтобы читать это, очевидно, некоторые не справляются с этим правильно, когда изображение загружается с помощью CSS.

Исправление:

Используйте ваше любимое программное обеспечение для редактирования фотографий на рабочем столе (Photoshop, GIMP и т. Д.), Чтобы открыть файл изображения и правильно установить поворот.

...