图像由CSS随机旋转[重复]答案

【问题标题】：Images are randomly rotated by CSS [duplicate]图像由CSS随机旋转[重复]
【发布时间】：2015-10-27 11:56:09
【问题描述】：

这是一个疯狂的问题，所以我这里有三张图片应该可以解释一切

首先，在 GUI 中旋转 90 度的图像

二、chrome的inspector展示的图片

三、通过chrome查看时的实际图片

什么在旋转这张图片？！我是否缺少 chrome 照片查看器正在拾取但不是我的应用程序的旋转元标记。 CSS 都是标准的，居中不重复封面...

【问题讨论】：

【解决方案1】：

    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);

对旋转后的图像使用这个 css

【讨论】：

【解决方案2】：

我认为这不是 CSS 的问题。最有可能的是，这张照片是用智能手机或类似的东西拍摄的。当设备旋转时，它实际上并没有在拍摄时旋转图像（可能是因为它的处理量太大），而是在图像属性中设置一个标志来指示图像查看器应该旋转图像（GIMP 会提示当你打开这样一个文件时）。

所以你遇到的问题是 Chrome 正确显示图像，因为它知道如何处理它，但是在元素检查器和你的 GUI 程序中使用了更轻量级的方法来呈现图形，因此它以原始的“原样”方式出现 - 即它忽略暗示需要旋转的图像属性。

您可以做的是在 GIMP 或您使用的任何其他程序中打开图像，然后以所需的方向保存图像。

希望对你有所帮助。

【讨论】：

这正是我所说的一些元标记的意思，有人知道这个元标记或如何在 PHP 或 JS 中检查它吗？？
stackoverflow.com/questions/20600800/… 检查已批准的答案以获取指向满足您需要的库的 github 链接。不过，我想说这有点矫枉过正，最简单的解决方案是处理图像，以便无论如何它们都能正确显示。
谢谢，我已将主题作为重复关闭并接受了答案